React 创建 js 与 ts 项目

一、npx 创建

• 创建 js 工程

$ npx create-react-app demo

• 创建 ts 工程

$ npx create-react-app demo --template typescript

二、npm 创建

• 全局安装 create-react-app

# 如果之前安装过，可先移除，保证最新版本
$ npm uninstall -g create-react-app
# 安装
$ npm install -g create-react-app

• 查看安装版本

$ create-react-app -V

• 创建 js 工程

$ create-react-app demo

• 创建 ts 工程

$ create-react-app demo --template typescript

三、$ npm run eject 释放配置文件

• 通过脚手架创建完项目后，会发现没有任何 配置文件（例如 webpack 相关配置文件）：
  create-react-app 的背后，隐藏着一个 webpack。一般情况下来说，webpack 是默默隐藏的幕后英雄，不需要修改它的配置，只需要简单无脑使用即可。
  create-react-app 本身的 webpack 配置文件存在于node_modules/react-scripts/ 目录下面，但是这个目录是 node_modules/，里面的源码都是不建议修改的。
  某些情况下要修改 webpack 配置。那么如何才能完成修改 webpack 配置这个需求呢？
  create-react-app 提供了一个命令，用于释放这些配置。命令是：

$ npm run eject

• 注意：eject 的翻译是：喷出，就是说把这些配置文件，从隐藏的位置给喷出来。而且 create-react-app 并不推荐大家这么做，因为这个步骤无法逆转。
• 这里经常遇到问题，产生报错，无法往下进行 npm run eject 报错，详解，所以执行之前，一定要做好备份工作，因为这个步骤不可逆转，也不是官方推荐执行的命令。
  执行完毕后，项目根目录下面就有 config 和 scripts 两个目录生成。同时，package.json 里面的 scripts，也更新了新的命令。
  
  上面命令内容变成了下面命令内容：
  
  多出来的 config 和 scripts 配置文件夹，用于自定义配置：