react项目的搭建与启动
- 准备工作（环境的搭建）
- react项目创建与启动
- 常用插件安装
- Sass/Scss安装
准备工作（环境的搭建）
（已经准备好的这一步可以跳过）
1.安装Node.js（安装一直选择下一步就行）
npm常用命令
| node -v | 检查是否安装成功，出现版本号安装成功 |
|---|---|
| npm -g install npm | 将npm包更新到最新版本 |
| npm cache clear --force | 清除缓存 |
| npm install webpack webpack-cli -g | 安装webpack(模块加载加打包工具) |
| npm install | 安装模块 |
| npm start | 启动模块 |
| 使用 -g 或 --global (npm install webpack webpack-cli -g) | 全局安装 |
| @ (npm install axios@0.24.0) | 安装指定版本 |
2.安装 cnpm(选择性安装)
之后可以选择安装 cnpm，即 npm 的国内镜像。使用 cnmp 的好处是在日后下载内容时会比较快，但是下载的包可能不是最新的。
安装 cnpm 的命令为 ：
npm install -g cnpm --registry=https://registry.npm.taobao.org
完成后就可以使用 cnpm 替代 npm 了，我不太喜欢用 cnpm，喜欢用的小伙伴注意一点，cnpm 不要与 npm 混合使用，一个项目用 cnpm 就从头用到底，不要中途敲错命令，否则就会出现混乱。不过万一遇到这种情况也不用慌，把项目的 node_modules 文件夹删了重新执行 npm/cnpm install 就行了，只是比较浪费时间。
3.安装Webpack
WebPack是一款模块加载器兼打包工具， 它能把各种资源， 如JS、JSX、ES 6、SASS、LESS、图片等都作为模块来处理和使用。
4,全局安装create-react-app
npm install -g create-react-app
react项目创建与启动
- 找到需要新建项目的目录输入cmd打开命令操作系统
2.输入命令create-react-app my-project创建my-project项目
3.根据提示，进入项目目录，并启动项目：
cd react-app
yarn start / npm start （没有安装yarn的使用npm）
4.项目结构
常用插件安装
Sass/Scss安装
SASS(Syntactically Awesome Stylesheets)是一种动态样式语言，为CSS融入了编程元素，提供了很多便利的写法，使得CSS的开发变得简单、可维护。
1.create-react-app默认情况下未暴露配置文件。要更灵活配置项目，需要将配置文件暴露出来。
执行以下命令，暴露配置文件：（注意：暴露配置的文件的操作不可逆！）
npm run eject
2.Remove untracked files, stash or commit any changes, and try again（报错）
在项目根目录下执行：
git add .
git commit -m "初始化项目(备注)"
3.再次执行npm run eject
成功后项目结构
4.安装node-sass
执行以下命令：
npm install node-sass --save-dev
安装完成后，项目已支持Sass/Scss，可以将原css文件后缀名修改为sacc/scss，别忘了把src/index.js中引入的frame.css后缀名修改为sacc/scss。
报错检查版本：
卸载node-sass 和 sass-loader
npm uninstall node-sass sass-loader（卸载当前版本）
npm install node-sass@4.14.1 sass-loader@8.0.0 --dev（版本与当前的不兼容，安装对应版本的包即可。）
安装的插件可以在package.json文件里查看
到这项目的简单创建就完成了，后面简单的说一下开发里的目录结构
