1.安装 yarn，重启（不重启，别的盘符有可能用不了）
在命令提示符中:
---查询当前镜像yarn config get registry
---设置为淘宝镜像yarn config set registry https://registry.npm.taobao.org
---设置为官方镜像yarn config set registry https://registry.yarnpkg.com
2. 安装 create-react-app
在命令提示符中:
yarn global add create-react-app 或
npm install create-react-app -g (非安装包安装的yarn 推荐)
3.创建 react项目
- 在命令提示符中:
- create-react-app 目录 | npx create-react-app 目录 | npm init react-app 目录
- yarn eject 解构出所有的配置文件 可选
---解构前,要先git init,git add .,再git commit -m"init"
---解构后,再去webpack.config.js中,注释new ESLintPlugin(),然后去scripts中的start.js中配置端口号,
- 根据报错提示缺少的包,就装包,例如yarn add @babel/plugin-syntax-jsx
yarn start | npm start开发
yarn build | npm run build打包 - 调试 需要安装给chrome浏览器一个插件 react-dev-tools 谷歌助手->chrome商店-搜索
4.错误处理
- 运行yarn 提示“不是内部或外部命令
装完重启 - create-react-app 提示“不是内部或外部命令
npm i create-react-app -g 用npm重装 - create-react-app 能用安装到一半报错(error)
node 全量安装 ,一路下一步安装过程中有个复选框选中,时长30分钟 - yarn eject
报git错误时: git init -> git add . -> git commit -m 'init' -> yarn eject - 报缺少babel 包: 安装一下（yarn add xxx -S)
5.环境配置
- 修改端口号:修改script/start.js
const DEFAULT_PORT = parseInt(process.env.PORT, 10) || 3001; - 去除eslint 警告:修改config/webpack.config.js
注释关于eslint的导入和rules规则
