我正在测试ES6模块,并希望让用户使用onclick以下方法访问一些导入的函数:
的test.html:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Module Test</title>
</head>
<body>
<input type="button" value="click me" onclick="hello();"/>
<script type="module">import {hello} from "./test.js";</script>
</body>
</html>
test.js:
export function hello() {console.log("hello");}
当我单击按钮时,开发人员控制台会说:ReferenceError:未定义hello.如何从模块导入函数,以便它们可用作onclick函数？
我正在使用Firefox 54.0 dom.moduleScripts.enabled设置为true.
我正在为浏览器编写 JavaScript，我的 script.js 有类似的东西
import { foo, bar } from "./lib/sth.js"
function main() { ... }
然后我的浏览器中有这个：
<script type=module src="./script.js"></script>
<body onload="main();"> ... </body>
但它一直给我这个错误：
未捕获的引用错误：加载时未定义 main ((index):7)
为什么我的 main 现在被定义了？在我使用 type=module 之前它工作得很好，但是使用 import 语句，我相信它必须是 type=module
我无法弄清楚为什么这个简单的代码不起作用:
index.html的:
<!doctype HTML>
<html>
<head>
<script type="module" src="/showImport.js"></script>
</head>
<body>
<button onclick="showImportedMessage();">Show Message</button>
</body>
</html>
showImport.js:
import showMessage from '/show.js';
function showImportedMessage() {
showMessage();
}
show.js:
export default "Why do I need this?";
export function showMessage() {
alert("Hello!");
}
它由NPM http-server提供服务.当我连接Chrome(v65)时,我看到以下错误
(index):8 Uncaught ReferenceError: showImportedMessage is not defined
at HTMLButtonElement.onclick ((index):8)
onclick @ (index):8
如果我摆脱type=module(并通过将showMessage函数放入导入/导出showImport.js)一切正常,但这样做的全部目的是使用模块.
此外,我不得不添加无用的export default声明,没有它Chrome会抱怨:
Uncaught SyntaxError: The requested module '/show.js' does not provide an export …