Mac上安裝create-react-app,經常出現安裝不上，這里說一下辦法：

方法一：

1. sudo npm install -g create-react-app 2. create-react-app my-react 3. cd my_code 4. npm start

方法二：

1. yarn global add create-react-app2. create-react-app my-app3. cd my_code4. yarn start

安裝redux

yarn add i redux -S 數據狀態管理 yarn add i react-redux -S react和redux做整合 yarn add i redux-thunk -S 發送異步請求 yarn add i react-router-dom -S 視圖跳轉，路由 yarn add i axios -S 發送請求 yarn add i antd -S antdDesign UI庫

antd去除多余組件

yarn add i react-app-rewired -D

修改package.json的啟動項配置

"scripts": {"start": " react-app-rewired start","build": " react-app-rewired build","test": " react-app-rewired test","eject": "react-scripts eject"}

yarn add i babel-plugin-import -D

antd插件按需加載

在用antd-mobile時，需要配置按需加載，那自然就用到了 babel-import-plugin
那么在用到這個插件的時候，自然就想到要用 react-app-rewired 來覆蓋配置。

react-scripts 升級到 2.1.2 以前：
（1）yarn add i babel-plugin-import -D
（2）項目根目錄創建config-overrides.js 內容如下

const { injectBabelPlugin } = require('react-app-rewired'); module.exports = function override(config, env) { config = injectBabelPlugin(['import', { libraryName: 'antd', libraryDirectory: 'es', style: 'css' }], config); return config; };

react-scripts 升級到 2.1.2 和以后安裝：
（1）yarn add i customize-cra -D
（2）項目根目錄創建config-overrides.js 內容如下

const {override,fixBabelImports,// addLessLoader, } = require("customize-cra");module.exports = override(fixBabelImports("import", {libraryName: "antd", libraryDirectory: "es", style: 'css' // change importing css to less}),// addLessLoader({// javascriptEnabled: true,// modifyVars: { "@primary-color": "#1DA57A" }// }) );

設置緩存文件

總結

以上是生活随笔為你收集整理的Mac上安装create-react-app的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。