最近我开始研究 webpack 和 react-scripts，我想知道使用它们的优缺点以及它们之间的不同之处。
问问题
37261 次
2 回答
115
基本上，它们服务于不同的目的，并且通常一起出现。我将解释它们的设计目的。
通天塔
Babel 是一个转译器。它可以将各种高版本的ECMAScript（不仅是ECMAScript，而且很容易理解）翻译成ES5，更广泛地被浏览器（尤其是旧版本）支持。它的主要工作是将不受支持或前沿的语言特性转化为 ES5。
网页包
Webpack 是一个依赖分析器和模块捆绑器。例如，如果模块 A 需要 B 作为依赖，而模块 B 需要 C 作为依赖，那么 webpack 会生成一个像 C -> B -> A 这样的依赖映射。实际上它比这要复杂得多，但一般概念是 Webpack 将具有复杂依赖关系的模块打包成 bundle。关于 webpack 与 babel 的关系： webpack 在处理依赖时，必须把所有东西都转成 javascript，因为 webpack 是在 javascript 之上工作的。因此，它使用不同的加载器将不同类型的资源/代码转换为 javascript。当我们需要 ES6 或 ES7 特性时，我们用它babel-loader来完成这个。
反应脚本
当我们开始一个基于反应的项目时，设置构建环境是一项艰巨且耗时的工作。为了解决这个问题，React 的开发人员创建了一个名为 npm 的包react-scripts，其中包含大多数人对于普通 React 应用程序所需的许多基本设置。Babel 和 webpack作为依赖项包含在react-scripts
于 2017-10-30T01:17:10.450 回答
9
WebPack 和 react-scripts 略有不同。
Webpack 用于为您的 Web 应用程序编译包，它可以是自由格式并具有一些入口点。此外，webpack 与 babel-presets 一起使用，它允许您在相对较旧的浏览器中使用现代 ES6+ 结构。此外，webpack 负责将依赖的 node_modules 组装到一个文件中，并可能对其进行压缩和优化。你可以在这里阅读更多关于 webpack 哲学的信息：https ://webpack.js.org/concepts/
React-scripts 只是启动一些定制的 webpack-dev-server 的入门工具包，它被配置为与为 React 游乐场提供的样板一起工作。这只是演示目的。大多数现代网络库都有自己的入门工具包，甚至还有服务器端库，例如https://github.com/reimagined/resolve/tree/master/packages/resolve-scripts等等
于 2017-09-21T07:32:52.960 回答