react4-webpack中 脚手架 less antd 按需加载 Router 安装配置 暴露webpack配置文件 calc计算属性

1.安装脚手架

npm install -g create-react-app
create-react-app my-app
cd my-app
npm start

 

2.安装所需的插件

yarn add react-router-dom axios less-loader less

3.安装AntD

yarn add antd

4.安装babel-plugin-import(按需加载配置:antd官网有说明)

yarn add babel-plugin-import --dev

5.暴露webpack配置文件(修改webpack内容  )

yarn eject

或则

npm run reject

安装报错
? Are you sure you want to eject? This action is permanent. Yes
This git repository has untracked files or uncommitted changes:

package.json
M yarn.lock

Remove untracked files, stash or commit any changes, and try
again.
error Command failed with exit code 1.

原因是生成的文件没有加入到版本库里，两个解决办法：

• 最简单：作为练习可以不用管git，直接删掉 .git文件夹 在terminal输入

rm -rf .git

• 推荐: 养成良好的git习惯，把所有的文件变化都加入的版本库里

git add .
git commit -m "Initializtion"

 yarn  eject

 

 

6.修改less-load