Question

我无法解决这个问题。我有一个带有index.html的小应用程序设置，其中包含一个javascript文件。与该文件位于同一目录的是另一个名为myJsModule.js的文件，其中包含以下代码：

export default class{

    doStuff()
    {
        console.log("calling goStuff() from external Module");
    }
}

从html加载的主要javascript文件然后以这种方式进行导入：

import myJsModule from "myJsModule";
// TESTING MODULES
let myNewModule = new myJsModule();
myNewModule.doStuff();

我有一个使用Node运行的本地Web服务器，因此我通过localhost：http://127.0.0.1:8080访问此index.hmtl。

我收到以下错误：Uncaught SyntaxError：意外的标识符（指我的主js文件上的myJsModule）。我也尝试使用babel将其转换为以前的javascript。我使用＆＃34; require＆＃34;。

时遇到了同样的问题

我的本地服务器难道不应该这样做吗？或者我使用这个错误？

Answer 1

从Chrome 61开始，模块为natively supported。我能够让您的示例使用以下HTML和JavaScript。

的index.html：

<!DOCTYPE html>
<html>
<head>
    <title>Native Module</title>
</head>
<body>
    <p>Hello, world!</p>
    <script type="module">
        import MyJsModule from './MyJsModule.js';
        let myJsModule = new MyJsModule();
        myJsModule.doStuff();
    </script>
</body>
</html>

MyJsModule.js：

export default class MyJsModule {

    doStuff() {
        console.log("calling doStuff() from external Module");
    }

}

Javascript ES6模块无法正常工作

1 个答案: