react建立一個專案的基本步驟

1.需要有node的執行環境，如果沒有node請先安裝官網：https://nodejs.org/en/ （推薦使用穩定版本，不建議使用最新版本）

2.安裝react腳手架 create-react-app -g （-g 全域性安裝，i是insall的簡寫方式）

npm insall create-react-app  -g   或者   npm i create-react-app  -g 

3.推薦是用cnpm來安裝 如果未安裝請安裝 npm i cnpm -g 全域性安裝一下 (npm伺服器在國外，cnpm是國內淘寶映象，相對快一些，丟包率也相對小)

npm i cnpm -g   //-g全域性安裝

4.用react腳手架建立一個專案 （這裡 ‘my-react-app’是你需要建立的專案名稱，自己定義）

create-react-app  my-react-app

5.建立好了之後 cd 到新建的專案名稱 npm start 啟動專案

cd  my-react-app   // 進入到專案目錄

npm  start    // 啟動專案

6.執行npm run eject 釋放隱藏的封裝的指令碼檔案

npm run eject   //釋放隱藏指令碼檔案

7.如果在執行第6條的時候會報錯可以提交一下git倉庫

git init
git add .
git commit 
 
-m 'first commit'    //first commit  是自己寫的註釋資訊
npm run eject

8.現在可以配置和整合一些需要的第三方外掛(這裡-D和 -S的區別 -D開發環境所需要的依賴，-S是生產環境所需要的依賴 -g是全域性安裝在本地計算機)

cnpm i react-router-dom -S //路由

cnpm i node-sass --save-dev

cnpm i sass-loader --save-dev

cnpm iaxios -S

cnpm install redux -S //安裝 redux 狀態管理

cnpm iantd -S //安裝antd UI元件庫

9.修改新增配置

修改預設埠號 /scripts/start.js 搜尋 PORT //

const DEFAULT_PORT = parseInt(process.env.PORT, 10) ||3000;    //3000就是預設的埠號   修改成想要的埠號即可

配置 @ 別名 /config/webpack.config.js 裡找到 resolve.alias

'@':path.resolve(__dirname,'../src')         // 給@符號配置一個絕對路徑的識別符號

https://create-react-app.dev/docs/proxying-api-requests-in-development react代理的做法，（參考react腳手架文件 按文件為主）

安裝 cnpm install http-proxy-middleware -D

新建代理檔案 src/setupProxy.js

  const { createProxyMiddleware } = require('http-proxy-middleware');
  module.exports = function(app) {
    app.use(
      '/api',
      createProxyMiddleware({
        target: 'http://xxx.com',   // 目標伺服器
        changeOrigin: true
      })
    );
  };

把這些都配置好就足夠開發需求啦 ！！！