javascript - 如何使用 Babel 将所有包含的文件编译为一个？

Question

我在我的项目中使用 Babel。问题是，我的 server.js 中有这行代码:

import schema from "./data/schema";

(data/schema.js 采用 ES2015 语法)。

当我尝试用 babel 编译我的 server.js 时，像这样:

babel -o server_production.js --minified  server.js

它会生成一个没有错误的新文件，并将 import 指令替换为 require。但问题是，当我尝试使用 node 运行我的 babel 编译的 server.js 时，它会提示 data/schema.js ，因为它没有被转译成 ES5，只需要(确切的错误是 Unexpected token "import"，因为我在 data/schema.js 中使用了其他一些导入)。

所以，问题是:如何将我的文件和它导入的所有文件编译成一个文件？我试过 babel -o server_production.js --minified data/schema.js server.js，但也没有用。

Answer 1

Babel 默认不捆绑依赖。您需要使用像 rollup 这样的模块 bundler 。 .

为此，您需要定义一个类似于此的 rollup 配置:

rollup.config.js

import babel from 'rollup-plugin-babel';
import babelrc from 'babelrc-rollup';

export default {
  entry: 'server.js',
  dest: 'server_production.js',
  plugins: [
    babel(babelrc())
  ]
};

这适用于下面定义的 package.json 文件:

{
  "scripts": {
    "rollup": "./node_modules/.bin/rollup -c"
  },
  "devDependencies": {
    "babel-cli": "6.14.0",
    "babel-plugin-external-helpers": "6.8.0",
    "babel-preset-es2015": "6.14.0",
    "babelrc-rollup": "3.0.0",
    "rollup": "0.35.10",
    "rollup-plugin-babel": "2.6.1"
  }
}

你执行命令 npm run rollup -c 来打包和编译文件。

您可以在此处找到示例:https://ide.c9.io/ifeanyidev/babel-rollup-example