Error: "Unexpected token '{'. Import call expects exactly one argument" when trying to import functions from a script
Error: "Unexpected token '{'. Import call expects exactly one argument" when trying to import functions from a script
我已经设置了一个 html 页面,其中包含一个按钮,单击该按钮可激活来自外部 javascript 文件的功能。有问题的 JS 文件从另一个 JS 文件导入另外两个函数。但是,当我在浏览器 (Safari 12.0.2) 中加载 html 文件并在调试器中查看它时,我收到一条错误消息 "SyntaxError: Unexpected token '{'. import call expects exactly one argument."
文件名为 "html_test_run.html"、"test_run_javascript.js" 和 "export_test_run.js"。我曾尝试将脚本类型设置为 "module",但这只会导致一个新错误 "Origin null is not allowed by Access-Control-Allow-Origin"。我还尝试了三个 html 标签,前两个有 js 文件的来源,第三个定义了一个按钮将使用的新功能,但也没有用。
<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Test run</title>
<meta name="description" content="Test run">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!--
<link rel="stylesheet" href="">
-->
<script type="text/javascript" src="assets/test_run_javascript.js">
</script>
</head>
<body>
<button type="button" name="button" onclick="doSomething()">Click me</button>
</body>
</html>
第一个 JS 文件:
import {doSomethingElse1, doSomethingElse2} from "export_test_run.js";
function doSomething(){
doSomethingElse1();
doSomethingElse2();
console.log("Test successful");
}
第二个 JS 文件:
function doSomethingElse1(){
console.log("Test successful1");
}
function doSomethingElse2(){
console.log("Test successful2");
}
export {doSomethingElse1, doSomethingElse2};
我预计文件会正确加载并且按钮会在单击时调用函数 "doSomething()"。
如有任何帮助,我们将不胜感激。
您可以在第一页包含您的两个 js 文件:
<script type="text/javascript" src="export_test_run.js">
</script>
<script type="text/javascript" src="assets/test_run_javascript.js">
</script>
从您的 js 文件中删除导出和导入代码!
使用正确的路径进行包含。
您必须在您的页面上正确包含一个显示脚本类型为“模块”的脚本:
<script src="/js/index.js" type="module"></script>
如果浏览器不支持模块,您可以简单地使用“nomodule”属性进行处理:
<script nomodule>
console.info(`Your browser doesn't support native JavaScript modules.`);
</script>
我已经设置了一个 html 页面,其中包含一个按钮,单击该按钮可激活来自外部 javascript 文件的功能。有问题的 JS 文件从另一个 JS 文件导入另外两个函数。但是,当我在浏览器 (Safari 12.0.2) 中加载 html 文件并在调试器中查看它时,我收到一条错误消息 "SyntaxError: Unexpected token '{'. import call expects exactly one argument."
文件名为 "html_test_run.html"、"test_run_javascript.js" 和 "export_test_run.js"。我曾尝试将脚本类型设置为 "module",但这只会导致一个新错误 "Origin null is not allowed by Access-Control-Allow-Origin"。我还尝试了三个 html 标签,前两个有 js 文件的来源,第三个定义了一个按钮将使用的新功能,但也没有用。
<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Test run</title>
<meta name="description" content="Test run">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!--
<link rel="stylesheet" href="">
-->
<script type="text/javascript" src="assets/test_run_javascript.js">
</script>
</head>
<body>
<button type="button" name="button" onclick="doSomething()">Click me</button>
</body>
</html>
第一个 JS 文件:
import {doSomethingElse1, doSomethingElse2} from "export_test_run.js";
function doSomething(){
doSomethingElse1();
doSomethingElse2();
console.log("Test successful");
}
第二个 JS 文件:
function doSomethingElse1(){
console.log("Test successful1");
}
function doSomethingElse2(){
console.log("Test successful2");
}
export {doSomethingElse1, doSomethingElse2};
我预计文件会正确加载并且按钮会在单击时调用函数 "doSomething()"。
如有任何帮助,我们将不胜感激。
您可以在第一页包含您的两个 js 文件:
<script type="text/javascript" src="export_test_run.js">
</script>
<script type="text/javascript" src="assets/test_run_javascript.js">
</script>
从您的 js 文件中删除导出和导入代码! 使用正确的路径进行包含。
您必须在您的页面上正确包含一个显示脚本类型为“模块”的脚本:
<script src="/js/index.js" type="module"></script>
如果浏览器不支持模块,您可以简单地使用“nomodule”属性进行处理:
<script nomodule>
console.info(`Your browser doesn't support native JavaScript modules.`);
</script>