Chrome 61:意外的令牌导入

时间:2017-09-19 17:07:49

标签: javascript google-chrome es6-modules

使用import运行Chrome {61 supposed to support module loading

确实,保罗demo为我工作。但是,当我自己尝试时,我得到一个JS错误"意外的令牌导入"。 Chrome似乎对import

犹豫不决

的test.html

<!doctype html> 
<html>
<body>
<script src="test.js"></script>
</body>
</html>

test.js:

import {hello} from './something.js'
console.log(hello())

something.js

export {hello}
function hello() {
    return "hello world"
}

为什么Chrome无法理解&#34;导入&#34;

3 个答案:

答案 0 :(得分:17)

那应该是<script type=module src=test.js>。在模块脚本中巧妙地更改了整个语法(importexport是允许的,并且严格模式是强制性的。)

答案 1 :(得分:2)

最后...弄清楚了。 chrome://flags搜索import启用ES6导入语法。重新启动Chrome。要开心。

答案 2 :(得分:2)

对于那些想确切了解对我有用的人来说,这是上面几个答案的结合。我还必须通过在网址栏中输入chrome:// flags并搜索“导入”来启用Chrome的ES6导入功能。

首先是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>Testing JavaScript Stuff</title>
</head>
<body>
    <script type="module">
        import { circleArea, squareArea } from './CalcArea.js';

        console.log(circleArea(2));
        console.log(squareArea(2));
    </script>
</body>
</html>

因此您可以看到,只需将类型“ module”添加到脚本标签中,然后在下面进行导入。对于我的测试,CalcArea.js文件是这样的:

const circleArea = r => 3.14 * (r ** 2);

const squareArea = s => s * s;

export {circleArea, squareArea};