为什么它不起作用
它不起作用的原因是 Stackblitz 背后有一个资产构建系统，它将您的 Javascript 代码视为modules.
这意味着这些模块中定义的变量仅可用inside这些模块并做not附加到全局命名空间（正如您所期望的并且似乎已经习惯了）。
修复它所需的最低限度
为了实现这一目标，您需要明确地将这些变量附加到全局对象，在浏览器中恰好是window.
只需在 index.js 文件末尾添加以下行即可使您的代码正常工作：
window.test = test;
更好的方法
请注意，直接在元素上使用内联事件处理程序（例如onclick）被认为是不好的做法（并且确实有实际的缺点，但这会导致太多）。相反，你应该使用 JavascriptElement.prototype.addEventlistener()功能。到达那里的步骤：
Add an id添加到您的按钮，以便您的 Javascript 可以找到它：
<button id="testButton">Press</button>
接下来，将该元素放入变量中：
const button = document.getElementById('testButton');
最后一步：添加事件监听器click event:
button.addEventListener('click', test)
这是完整的index.js对于该重构版本：
// Import stylesheets
import './style.css';
function test(){
alert('here');
}
const button = document.getElementById('testButton');
button.addEventListener('click', test);
如何让它变得更安全、更好
另请注意：如果将加载 Javascript 的脚本标记放在head文档部分，您需要添加defer标签上的属性，或者将需要访问 DOM 的代码部分包装在DOMContentLoaded事件处理程序：
// Import stylesheets
import './style.css';
function test(){
alert('here');
}
document.addEventListener('DOMContentLoaded', function () {
const button = document.getElementById('testButton');
button.addEventListener('click', test);
}
否则，当您的 Javascript 尝试查找按钮并附加事件侦听器时，浏览器尚未解析 HTML。
