react类组件移动端项目

 

 

 npm i -D customize-cra react-app-rewired  http-proxy-middleware

npm i -S redux react-redux redux-thunk styled-components immutable redux-immutable react-router-dom@5 react-transition-group axios

• 清理创建好的项目中不需要的文件及文件夹

1. 删除public目录下的部份内容
2. 删除src目录下的部份内容

• 修改public/index.html
• 在src目录下创建根组件App.jsx与项目入口文件index.js
• 配置装饰器支持

// 在当前项目根目录下面创建一个名称为config-overrides.js文件，对webpack进行配置

const {
    override,
    addDecoratorsLegacy,
    addWebpackAlias
} = require("customize-cra");
const path = require("path");

module.exports = override(
    addDecoratorsLegacy (),
    // 添加webpack别名
    addWebpackAlias({
        ["@"]: path.resolve("./src"),
    })
);

• 修改package.json中的脚本命令为如下

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

 windows这样写就行,苹果本下插件

 

• 配置反向代理

// 在src目录下创建一个名称为setupProxy.js文件，提前为后续接口设置反向代理

const { createProxyMiddleware: proxy } = require("http-proxy-middleware");
module.exports = app => {
    app.use(
        "/api",
        proxy({
            target: "http://localhost:9000",
            changeOrigin: true,
	   pathRewrite:{
	      "^/api": ""
	   }
        })
    )
}

• 项目已在本机中初始化完成，需要在远程仓库中创建git仓库
• 本机把项目初始化一个git仓库

git init

git add .

git commit -m “说明”

git remote add origin https://远程地址

git push -u origin master(分支)

• 提交到远程后，在本机开始用分支来进行，不要在master中进行开发，切记

---