React中使用create-react-app命令创建一个项目，运行npm run eject报错解决

React中使用create-react-app命令创建一个项目，运行npm run eject报错解决

• 使用ant design搭建后台模板

  1. 使用create-react-app创建前端项目,并启动项目

     create-react-app react-ant-admin-front
     cd react-ant-admin-front
     npm start
     

  2. 引入react-router和ant design

     npm install react-router-dom --save
     npm install antd --save
     

  3. 为了能按需加载ant design代码，需要进行配置

     npm run eject
     

但是会报错

• 报错

 This git repository has untracked files or uncommitted changes:

Remove untracked files, stash or commit any changes, and try again.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] eject: `react-scripts eject`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the [email protected] eject script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

• 解决：

 先
git add .
然后
git commit -m "init"
然后再npm run eject

• 为什么要运行npm run eject命令

  • 以目前的项目结构配置，运行ant design的组件时，会加载ant design全部代码，为了能够提高性能，做到按需加载，需要进行配置
  • 执行完上述命令之后，项目中会多出一个 config 的文件夹。

  4. 要做到按需加载，需要引入一个按需加载的组件

     npm install babel-plugin-import --save-dev
     

• 前端环境全部搭建完成，接下来就可以进行前端的开发工作了