create-react-app脚手架基本配置讲解

大家都熟悉在搭建vue项目时，尤大神给我们提供了一个专门的脚手架vue-cli；使用这个脚手架便可以快速的将项目骨架搭建起来；同样的react也有对应的脚手架：create-react-app

可以使用npm进行下载：

npm install -g create-react-app

国内npm一般下载比较慢或者是常出现下载失败的情况，我们可以指定下载的仓库：

npm install -g create-react-app --registry https://registry.npm.taobao.org

或者直接设置npm的默认仓库：

npm config set registry https://registry.npm.taobao.org 

首先初始化一个项目：

create-react-app <filename>其中<filename>是项目的名称

下面就项目目录结构进行分析：

1:项目目录下面的public和src目录下的index文件必须存在且不能修改名称；其他的文件可以删除和修改名称，因为webpack只会编译src目录下面的文件，所以项目中需要编译的的文件都需要放在src下面。

2:可使用的脚本：

 npm start：启动项目并且默认在3000端口下运行该项目；如果想要改变端口，可以修改配置文件script下的start.js里面的DEPAULT_PORT字段对应的端口号

npm build：打包项目，并且将放在build目录中；如果想要改变打包过后的文件夹名称；可以修改配置文件config文件下的path.js里面的appBuild字段。

npm test：在交互监视模式下启动测试运行程序

npm run eject：这是一个单项操作；执行之后，就不能逆向返回了；它的作用是在你不满足原来的项目配置结构的时候；可以使用这个命令将配置文件暴露出来。一般在小型项目，不需要修改什么配置的时候；create-react-app原本的配置就可以满足需求了。不需要执行这个命令将配置项暴露出来；但是在大的项目里面需要自定义一些配置的时候该命令就有用武之地了。