React项目build

1.项目根目录下新建app.js文件

// 使用 express 搭建一个服务器
const express = require("express");
const { createProxyMiddleware } = require("http-proxy-middleware");
const app = express();
app.use(
  "/api",
  createProxyMiddleware({
    target: "https://www.ahsj.link/rambo",
    changeOrigin: true,
    pathRewrite: (path) => path.replace("/api", ""),
  })
);
app.use(express.static("build"));
app.listen(8080);

// 将来打包可能会有这几种情况：
// 1. 打包好后，直接给后端，让后端进行静态托管
//      我们发现直接打包放到后端，会导致请求可能会 404 ，原因是没有走代理
//      我们在前端进行开发的时候，代理是 webpack 帮我们进行的，当打包后，是没有这个代理的
// 1.1 如果接口服务器就是静态资源服务器，只需要把 '/api' 删除，请求会自动请求相同域名下的接口
// 1.2 如果接口服务器不是静态资源服务器，需要把 '/api' 修改为真正请求的地址，重新打包,但是这个时候一定会跨域
//       需要让后端做对应的配置转发  -- 至于怎么做，不用管  -- 其实说白了，也只是在静态资源服务器进行 一次代理

2.也可以通过process.env知道当前是什么环境

import axios from "axios";

const instance = axios.create({
  baseURL: "/api",
  // 可以判断一下，如果是生产环境，使用一个对应的 url，如果是开发环境，使用另一个url
  baseURL:
    process.env.NODE_ENV === "development"
      ? "/api"
      : "https://www.ahsj.link/rambo", // 但是具体写什么，需要大家息根据实际情况确定
  timeout: 5000,
});