项目初始化05

config/webpackDevServer.config.js

-'use strict';
+const fs = require("fs");
+const evalSourceMapMiddleware = require("react-dev-utils/evalSourceMapMiddleware");
+const noopServiceWorkerMiddleware = require("react-dev-utils/noopServiceWorkerMiddleware");
+const ignoredFiles = require("react-dev-utils/ignoredFiles");
+const redirectServedPath = require("react-dev-utils/redirectServedPathMiddleware");
+const paths = require("./paths");
+const getHttpsConfig = require("./getHttpsConfig");
 
-const fs = require('fs');
-const evalSourceMapMiddleware = require('react-dev-utils/evalSourceMapMiddleware');
-const noopServiceWorkerMiddleware = require('react-dev-utils/noopServiceWorkerMiddleware');
-const ignoredFiles = require('react-dev-utils/ignoredFiles');
-const redirectServedPath = require('react-dev-utils/redirectServedPathMiddleware');
-const paths = require('./paths');
-const getHttpsConfig = require('./getHttpsConfig');
-
-const host = process.env.HOST || '0.0.0.0';
+const host = process.env.HOST || "0.0.0.0";
 const sockHost = process.env.WDS_SOCKET_HOST;
 const sockPath = process.env.WDS_SOCKET_PATH; // default: '/ws'
 const sockPort = process.env.WDS_SOCKET_PORT;
 
 module.exports = function (proxy, allowedHost) {
   const disableFirewall =
-    !proxy || process.env.DANGEROUSLY_DISABLE_HOST_CHECK === 'true';
+    !proxy || process.env.DANGEROUSLY_DISABLE_HOST_CHECK === "true";
   return {
     // WebpackDevServer 2.4.3 introduced a security fix that prevents remote
     // websites from potentially accessing local content through DNS rebinding:
@@ -35,11 +33,11 @@ module.exports = function (proxy, allowedHost) {
     // really know what you're doing with a special environment variable.
     // Note: ["localhost", ".localhost"] will support subdomains - but we might
     // want to allow setting the allowedHosts manually for more complex setups
-    allowedHosts: disableFirewall ? 'all' : [allowedHost],
+    allowedHosts: disableFirewall ? "all" : [allowedHost],
     headers: {
-      'Access-Control-Allow-Origin': '*',
-      'Access-Control-Allow-Methods': '*',
-      'Access-Control-Allow-Headers': '*',
+      "Access-Control-Allow-Origin": "*",
+      "Access-Control-Allow-Methods": "*",
+      "Access-Control-Allow-Headers": "*",
     },
     // Enable gzip compression of generated files.
     compress: true,

package.json

@@ -2,6 +2,7 @@
   "name": "bkunyun-demo",
   "version": "0.1.0",
   "private": true,
+  "proxy": "",
   "dependencies": {
     "@babel/core": "^7.16.0",
     "@emotion/react": "^11.9.0",
@@ -77,6 +78,9 @@
     "workbox-webpack-plugin": "^6.4.1"
   },
   "scripts": {
+    "dev": "set \"REACT_APP_PROXY=http://47.57.4.97\" && npm start",
+    "relrese-cn": "set \"REACT_APP_PROXY=http://47.75.104.171\" && npm start",
+    "relrese-en": "set \"REACT_APP_PROXY=http://47.57.235.86\" && npm start",
     "start": "node scripts/start.js",
     "build": "node scripts/build.js",
     "test": "node scripts/test.js"

scripts/start.js

-'use strict';
-
 // Do this as the first thing so that any code reading it knows the right env.
-process.env.BABEL_ENV = 'development';
-process.env.NODE_ENV = 'development';
+process.env.BABEL_ENV = "development";
+process.env.NODE_ENV = "development";
 
 // Makes the script crash on unhandled rejections instead of silently
 // ignoring them. In the future, promise rejections that are not handled will
 // terminate the Node.js process with a non-zero exit code.
-process.on('unhandledRejection', err => {
+process.on("unhandledRejection", (err) => {
   throw err;
 });
 
 // Ensure environment variables are read.
-require('../config/env');
+require("../config/env");
 
-const fs = require('fs');
-const chalk = require('react-dev-utils/chalk');
-const webpack = require('webpack');
-const WebpackDevServer = require('webpack-dev-server');
-const clearConsole = require('react-dev-utils/clearConsole');
-const checkRequiredFiles = require('react-dev-utils/checkRequiredFiles');
+const fs = require("fs");
+const chalk = require("react-dev-utils/chalk");
+const webpack = require("webpack");
+const WebpackDevServer = require("webpack-dev-server");
+const clearConsole = require("react-dev-utils/clearConsole");
+const checkRequiredFiles = require("react-dev-utils/checkRequiredFiles");
 const {
   choosePort,
   createCompiler,
   prepareProxy,
   prepareUrls,
-} = require('react-dev-utils/WebpackDevServerUtils');
-const openBrowser = require('react-dev-utils/openBrowser');
-const semver = require('semver');
-const paths = require('../config/paths');
-const configFactory = require('../config/webpack.config');
-const createDevServerConfig = require('../config/webpackDevServer.config');
-const getClientEnvironment = require('../config/env');
-const react = require(require.resolve('react', { paths: [paths.appPath] }));
+} = require("react-dev-utils/WebpackDevServerUtils");
+const openBrowser = require("react-dev-utils/openBrowser");
+const semver = require("semver");
+const paths = require("../config/paths");
+const configFactory = require("../config/webpack.config");
+const createDevServerConfig = require("../config/webpackDevServer.config");
+const getClientEnvironment = require("../config/env");
+const react = require(require.resolve("react", { paths: [paths.appPath] }));
 
 const env = getClientEnvironment(paths.publicUrlOrPath.slice(0, -1));
 const useYarn = fs.existsSync(paths.yarnLockFile);
@@ -45,7 +43,7 @@ if (!checkRequiredFiles([paths.appHtml, paths.appIndexJs])) {
 
 // Tools like Cloud9 rely on this.
 const DEFAULT_PORT = parseInt(process.env.PORT, 10) || 3000;
-const HOST = process.env.HOST || '0.0.0.0';
+const HOST = process.env.HOST || "0.0.0.0";
 
 if (process.env.HOST) {
   console.log(
@@ -59,28 +57,28 @@ if (process.env.HOST) {
     `If this was unintentional, check that you haven't mistakenly set it in your shell.`
   );
   console.log(
-    `Learn more here: ${chalk.yellow('https://cra.link/advanced-config')}`
+    `Learn more here: ${chalk.yellow("https://cra.link/advanced-config")}`
   );
   console.log();
 }
 
 // We require that you explicitly set browsers and do not fall back to
 // browserslist defaults.
-const { checkBrowsers } = require('react-dev-utils/browsersHelper');
+const { checkBrowsers } = require("react-dev-utils/browsersHelper");
 checkBrowsers(paths.appPath, isInteractive)
   .then(() => {
     // We attempt to use the default port but if it is busy, we offer the user to
     // run on a different port. `choosePort()` Promise resolves to the next free port.
     return choosePort(HOST, DEFAULT_PORT);
   })
-  .then(port => {
+  .then((port) => {
     if (port == null) {
       // We have not found a port.
       return;
     }
 
-    const config = configFactory('development');
-    const protocol = process.env.HTTPS === 'true' ? 'https' : 'http';
+    const config = configFactory("development");
+    const protocol = process.env.HTTPS === "true" ? "https" : "http";
     const appName = require(paths.appPackageJson).name;
 
     const useTypeScript = fs.existsSync(paths.appTsConfig);
@@ -100,7 +98,9 @@ checkBrowsers(paths.appPath, isInteractive)
       webpack,
     });
     // Load proxy config
-    const proxySetting = require(paths.appPackageJson).proxy;
+    // const proxySetting = require(paths.appPackageJson).proxy;
+    const proxySetting =
+      require(paths.appPackageJson).proxy || process.env.REACT_APP_PROXY;
     const proxyConfig = prepareProxy(
       proxySetting,
       paths.appPublic,
@@ -119,7 +119,7 @@ checkBrowsers(paths.appPath, isInteractive)
         clearConsole();
       }
 
-      if (env.raw.FAST_REFRESH && semver.lt(react.version, '16.10.0')) {
+      if (env.raw.FAST_REFRESH && semver.lt(react.version, "16.10.0")) {
         console.log(
           chalk.yellow(
             `Fast Refresh requires React 16.10 or higher. You are using React ${react.version}.`
@@ -127,26 +127,26 @@ checkBrowsers(paths.appPath, isInteractive)
         );
       }
 
-      console.log(chalk.cyan('Starting the development server...\n'));
+      console.log(chalk.cyan("Starting the development server...\n"));
       openBrowser(urls.localUrlForBrowser);
     });
 
-    ['SIGINT', 'SIGTERM'].forEach(function (sig) {
+    ["SIGINT", "SIGTERM"].forEach(function (sig) {
       process.on(sig, function () {
         devServer.close();
         process.exit();
       });
     });
 
-    if (process.env.CI !== 'true') {
+    if (process.env.CI !== "true") {
       // Gracefully exit when stdin ends
-      process.stdin.on('end', function () {
+      process.stdin.on("end", function () {
         devServer.close();
         process.exit();
       });
     }
   })
-  .catch(err => {
+  .catch((err) => {
     if (err && err.message) {
       console.log(err.message);
     }

src/api/demo_api.ts

@@ -2,7 +2,7 @@ import request from "@/utils/axios/service";
 
 function current() {
   return request({
-    url: "/accounts/current-mock",
+    url: "/accounts/current",
     method: "get",
   });
 }

src/views/demo/index.tsx

@@ -23,6 +23,7 @@ const Demo = ({
   return (
     <Box>
       <Box>{JSON.stringify(childrenRoutes)}</Box>
+      <Box>{JSON.stringify(process.env.NODE_ENV)}</Box>
       <Button onClick={() => message.success("测试测试")}>message测试</Button>
     </Box>
   );