我试图在我的项目中运行一些ES6代码,但我得到了一个意外的令牌导出错误。
export class MyClass {
constructor() {
console.log("es6");
}
}
我试图在我的项目中运行一些ES6代码,但我得到了一个意外的令牌导出错误。
export class MyClass {
constructor() {
console.log("es6");
}
}
当前回答
我遇到过这个问题,我花了一个小时才找到我的问题。
问题是我正在将我的代码从非模块更改为模块,并且我忘记删除导入的脚本文件。
我的“table.js”文件有以下一行。这是模块文件。
export function tableize(tableIdentifier) {
我的“orderinquiry.js”文件有以下一行。
import { tableize, changeColumnSizesDynamic } from '../common/table.js';
我的“orderinquiry.html”有以下两行。
<script src='/resources/js/common/table.js'></script>
<script type='module' src='/resources/js/client/orderinquiry.js'></script>
而第二行很好,声明type='module。但是第一行直接链接到table.js,导致了意外的错误。一切开始工作时,我删除了第一个<脚本>。
其他回答
我遇到过这个问题,我花了一个小时才找到我的问题。
问题是我正在将我的代码从非模块更改为模块,并且我忘记删除导入的脚本文件。
我的“table.js”文件有以下一行。这是模块文件。
export function tableize(tableIdentifier) {
我的“orderinquiry.js”文件有以下一行。
import { tableize, changeColumnSizesDynamic } from '../common/table.js';
我的“orderinquiry.html”有以下两行。
<script src='/resources/js/common/table.js'></script>
<script type='module' src='/resources/js/client/orderinquiry.js'></script>
而第二行很好,声明type='module。但是第一行直接链接到table.js,导致了意外的错误。一切开始工作时,我删除了第一个<脚本>。
我让模块工作了一段时间,然后它们没有出现这个Uncaught SyntaxError:意外的令牌导出错误。
结果是,我添加了一个开大括号而没有一个闭大括号。喜欢的东西:
if (true) {
/* } missing here */
export function foo() {}
虽然最大的错误是忘记了end},但解析器首先在大括号内找到一个导出,这是不允许的。
export关键字必须在文件的顶层。
So:
if (true) {
export function foo() {}
}
也不合法。当解析器遇到这种情况时,它立即停止解析,模糊地宣布错误使用了export,并给出与加载使用export关键字的“非模块”JavaScript文件时相同的错误。它从不报告底层缺少大括号错误。
我花了很长时间才弄明白,所以我在这里发帖,以帮助未来的患者。
理想情况下,解析器将报告只允许在文件的顶层导出。
只需使用tsx作为运行时而不是节点。它将允许你使用正常的import语句,而不必将你的项目切换到type: module,也不必处理type: module的讨厌后果。此外,你还将获得TypeScript支持。
如果遇到此错误,也可能与将JavaScript文件包含到html页面的方式有关。在加载模块时,必须显式地声明这些文件。这里有一个例子:
//module.js:
function foo(){
return "foo";
}
var bar = "bar";
export { foo, bar };
当你像这样包含脚本时:
<script src="module.js"></script>
你会得到错误:
Uncaught SyntaxError:意外的令牌导出
你需要包含一个type属性设置为"module"的文件:
<script type="module" src="module.js"></script>
然后它应该会像预期的那样工作,你已经准备好在另一个模块中导入你的模块了:
import { foo, bar } from "./module.js";
console.log( foo() );
console.log( bar );
要使用ES6,请添加babel-preset-env
在你的。babelrc中:
{
"presets": ["@babel/preset-env"]
}
答案更新,感谢@ghanbari评论应用babel 7。