我有一个链接到 JavaScript 文件的基本 HTML 表单页面。这两个文件都存在于 Node 项目中，我使用 Parcel 作为捆绑器（因为我最终想将其转换为 TypeScript）。
当我在浏览器中运行html文件时，JavaScript函数将触发，但是当我运行Parcel构建时，index.html将编译，但JavaScript函数不会触发。它识别js文件，因为我可以在函数外部调用dom查询。
当我检查控制台时，出现错误：
(index):12 Uncaught ReferenceError: validationFunction is not defined
at HTMLInputElement.onchange
但这没有意义，因为该函数是在 Parcel 构建之外定义的。
使用 Parcel 编译时如何让 index.html 页面识别 JavaScript 函数？
index.js 文件如下：
function validationFunction(event) {
event.preventDefault();
var div;
div = document.getElementById("appendedText");
div.innerHTML += "hello world";
}
index.html 是：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Document</title>
</head>
<body>
<form action="" method="post">
First name:<br />
<input onChange="validationFunction(event)" type="text" name="firstname" /><br />
<input type="submit" name="Submit" />
</form>
<h1></h1>
<div id="appendedText"></div>
<script src="index.js"></script>
</body>
</html>
package.json 是：
{
"name": "typescriptprojects",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"dev": "parcel index.html"
},
"author": "",
"license": "ISC",
"devDependencies": {
"typescript": "^3.5.3"
},
"dependencies": {
"parcel-bundler": "^1.12.3"
}
}
