修改create-react-app的webpack.config.js文件

Question

我想修改 Dan Abramov 创建的 create-react-app 的现有 webpack.config.js 文件 - 我想添加一个额外的加载器 'react-html-attrs'，这样我就可以直接使用 class 标记而不必将其更改为驼峰式 className。

所以这是我的做法： 1. 我去了官方 github 文档中的这个 babel 插件 - https://github.com/insin/babel-plugin-react-html-attrs，并且它说如果你在使用 babel-6，请安装 npm 包： npm install --save-dev babel-plugin-react-html-attrs

然后在我的某个组件 js 中，我返回一个包含 class 的 jsx，而不是 classname - 但我仍然得到这个错误消息。

如何在 create react app 的 webpack 配置中添加自定义 babel 加载器？ 还有哪一个文件需要编辑 - 目录中有4个这样的文件？

- Probosckie

Answer 1

很遗憾，除非您转换为自定义设置，否则无法添加新的 Babel 插件。

通过运行npm run eject，您将能够根据自己的需要修改 Babel 和 webpack 配置，其中包含所有的（不）优点。

- jumoel

---

如果我运行npm run eject命令，它只会影响该文件夹/项目的CRA安装吗？ 还是它会影响全局安装的npm包 - 以至于我将无法再次使用create-react-app命令？ - Probosckie

幸运的是，只针对那个单一项目。 :-) - jumoel

哇，太棒了 - 这打开了各种有趣的可能性。 - Probosckie

Answer 2

进入您的项目目录并运行

npm run eject

这将为您提取所有配置文件，包括 webpack.config.js 到一个名为 "config" 的文件夹中以供编辑。输入 config/webpack.config.js，找到 "return" 语句，在其中有一个 "resolve" 配置选项。将以下内容添加到该对象中：

symlinks: false

- Code Wiget