react类组件移动端项目

react类组件移动端项目_第1张图片

 react类组件移动端项目_第2张图片

 react类组件移动端项目_第3张图片

 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中进行开发,切记

你可能感兴趣的