Babel 与 webpack 加载器

Posted 2023-03-24

【中文标题】Babel 与 webpack 加载器

【英文标题】：Babel vs. a webpack loader

【发布时间】：2019-02-11 03:48:28

【问题描述】：

我对这两个方面的经验有限，但是，根据我对他们所做工作的理解，我有一个基本问题。 webpack 加载器似乎正在将源代码从一种形式转换为另一种形式。另一方面，Babel（是一个转译器）将您的新 javascript 代码转换为旧 JavaScript 代码（可在所有浏览器上运行）。

两者似乎都做了非常相似的事情。为什么我们不能只使用“将新的 JavaScript 代码转换为旧的 JavaScript 代码”的 webpack 加载器，而不是在管道中使用 Babel？

【参考方案1】：

除了加载器和转译器的用例之外，您的理解几乎是正确的。加载器是 Webpack 生态系统中的通用术语，而转译器是加载器的一个示例（例如，babel-loader 是负责转译 JavaScript 代码的加载器）。

为什么我们不能只使用“将新 JavaScript 代码转换为旧 JavaScript 代码”的 Webpack 加载器，而不是在管道中使用 Babel？

因为没有加载器可以转换 Webpack 附带的 JavaScript 代码。这是list of loaders。 Webpack 团队维护其中的一些。

【讨论】：

@nev.m 我希望这能回答你的问题。感谢您的支持。

【参考方案2】：

Babel 并非特定于 webpack。 webpack 加载器通常只是转译器的包装器。 Webpack 需要一个加载器来检测转译器的输入和输出，就像 babel-loader 为 Babel 所做的那样。 Webpack 需要加载器，因为没有用于转译器的标准 API：有些有 JavaScript API，有些使用 stdin/stdout，有些写入文件...