javascript - 如何在 ECMAScript 6 中使用模块？

Question

我尝试使用此代码作为示例，并使用 Babel 编译此代码

let notExported = 'abc';
export function square(x) {
    return x * x;
}
export const MY_CONSTANT = 123;

编译后:

Object.defineProperty(exports, '__esModule', { value: true });
exports.square = square;
var notExported = 'abc';
function square(x) {
    return x * x;
}
var MY_CONSTANT = exports.MY_CONSTANT = 123;

但浏览器显示错误:“ Uncaught ReferenceError :未定义导出”。我做错了什么？也许我需要使用一些库(如果是，怎么做)？

Answer 1

Babel 会将 ES6 模块语法转换为其他模块格式。默认的是 CommonJS。 Node 默认支持 CommonJS。如果您希望在浏览器中使用 CommonJS 模块，则需要将 Babel 与模块 bundler (如 Webpack 或 Browserify)一起使用。您可以使用以下内容:

npm install browserify babelify

并捆绑

./node_modules/.bin/browserify -t babelify yourFile.js -o bundledFile.js

然后在浏览器中加载bundledFile.js。