如何使用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

它产生一个无错误的新文件，并用“require”替换“import”指令。但问题是，当我尝试用“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”，但那也没用。

- serge1peshcoff

---

我认为 Babel 不会进行依赖分析，你需要指定所有想要转换的文件。 - Felix Kling

Answer 1

Babel默认不会打包依赖项。您需要使用像rollup这样的模块打包工具。

为此，您需要定义一个类似于以下配置的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

- gnerkus

---

npm run rollup 就足够了。 - haffla

有人更新了 Babel 7 的这个过程吗？特别是 rollup.config.js 需要不同的属性，而且 babel-plugin-external-helpers 不再兼容。 - jlewkovich

很高兴终于找到有人在尝试同样的事情，但却因为得到了一个可能非常过时的三年前的答案而感到失望。 - HMR

我收到了“[!] 错误：您必须提供选项输入以进行Rollup”的消息。 - Muhammed Moussa

Answer 2

您可以使用以下解决方案，使用Babel将所有包含的文件编译为一个文件：

npx babel src --out-file script-compiled.js

- Revanth Kumar

---

这将要么将一个文件编译为另一个单独的文件，要么将同一目录中的所有文件编译为一个单独的文件。你从@babel-cli网站上复制了这段代码，却对主题一无所知。 - Marco Faustinelli