【希望大家不要嫌弃我这个新手..】 用create-react-app这个脚手架创建的项目webpack.config.js在哪？

#1

用create-react-app这个脚手架创建的项目webpack.config.js在哪？

新创建的项目里应该是已经配置好了webpack吧，已经可以热更新了，但是找不到webpack.config.js 在哪。

插入了 ant-design-mobile UI库，但是需要修改webpack配置

resolve: {
  modulesDirectories: ['node_modules', path.join(__dirname, '../node_modules')],
  extensions: ['', '.web.js', '.js', '.json'],
},

和 babel-plugin-import 配置，

// .babelrc
{"plugins": [["import", { "style": "css", "libraryName": "antd-mobile" }]]}
// or webpack config file
webpackConfig.babel.plugins.push(['import', { libraryName: 'antd-mobile', style: 'css' }]);

不知道配置文件在哪里。。。

求大神帮忙~

#2

配置这个很麻烦哦

#3

建议实际项目还是自己搭建脚手架吧

#4

用create-react-app这个脚手架配置ant-d, 要比自己搭建项目再配置webpack热更新还要麻烦啊？

#5

你运行一下命令

npm run eject

就可以把create-react-app内部的webpack配置文件解压出来

#6

嗯。 看到了， 这么做有什么弊端吗？ 那我直接在这里编辑就可以了啊？

#7

弊端就是改他们的配置文件很麻烦，并不能适应所有的项目

#8

哦哦， 我现在就想加上面的两句话到webPack.config.js 里，刚一直找不到文件，这个任务是完成了，真是感谢了，以后的项目还是要考虑手动配置的；

还有下面这个配置代码要写在哪里您知道吗？

babel-plugin-import 配置，

// .babelrc
{"plugins": [["import", { "style": "css", "libraryName": "antd-mobile" }]]}
// or webpack config file
webpackConfig.babel.plugins.push(['import', { libraryName: 'antd-mobile', style: 'css' }]);
#9

可以在项目里新建一个 .babelrc文件试试

#10

我看他写

// or webpack config file
webpackConfig.babel.plugins.push(['import', { libraryName: 'antd-mobile', style: 'css' }]);

应该是可以在webpack.config.js 里加上这句代码， 但是不知道加在哪啊

#11

你试试看有没有用

#12

加过了，组件引入有点问题， 我再试试啊， 非常感谢你啦 ！ 以后可能还会麻烦您的~

#13

:yum:
这是我搭建react项目的记录
https://github.com/sundaypig/build-react-tutorial
希望可以帮到你

#14

好的， 感谢啦。。。

#15

最好不要运行 :

npm run eject

理由当然是 eject 后与官方的更新不好同步啦！这对于一个稳定的项目很重要

#16

哦哦， 好的， 感谢啦， 我会深入了解的。。

#17

基本上不用去改config里面的东西。这个脚手架的配置都在package.json里配置，好好看文档吧

#18

嗯嗯， 好的

#19

有专门的文档是介绍这个脚手架应用的吗？

#20

没有中文的，只能去它的github上看了，不过运行eject让配置文件暴露出来很多人都这么干，况且你可以学它的方法然后自己配