add different env config

Yixi · Yixi · commit b9006f71e6f4 · 2019-12-27T23:17:35.000+08:00
diff --git a/build/webpack.dev.config.js b/build/webpack.dev.config.js
@@ -2,11 +2,14 @@ const path = require('path')
 const webpack = require('webpack')
 const HtmlWebpackPlugin = require('html-webpack-plugin')
 const ForkTsCheckerWebpackPlugin = require("fork-ts-checker-webpack-plugin")
+const fs = require('fs')
 
 const PORT = 4222;
 const HOST = 'http://localhost';
 const URL = `${HOST}:${PORT}`;
 
+const config = fs.readFileSync(path.join(__dirname, '../config/config-local.js'), 'utf-8')
+
 module.exports = {
   mode: 'development',
   entry: [
@@ -72,6 +75,7 @@ module.exports = {
     new HtmlWebpackPlugin({
       template: "../src/app.html",
       filename: "index.html",
+      config: `<script>${config}</script>`
     }),
     new webpack.HotModuleReplacementPlugin(),
 
diff --git a/build/webpack.prod.config.js b/build/webpack.prod.config.js
@@ -85,6 +85,7 @@ module.exports = {
     new HtmlWebpackPlugin({
       template: "../src/app.html",
       filename: "index.html",
+      config: '<script src="config.js"></script>'
     }),
     new MiniCssExtractPlugin({
       filename: "[name].[hash:7].css",
diff --git a/config/config-local.js b/config/config-local.js
@@ -0,0 +1,3 @@
+window.CONFIG = {
+  api: 'http://localhost:8089/api'
+}
diff --git a/config/config-prod.js b/config/config-prod.js
@@ -0,0 +1,3 @@
+window.CONFIG = {
+  api: 'http://api-o.yixi.pro/api'
+}
diff --git a/package.json b/package.json
@@ -22,7 +22,8 @@
   "scripts": {
     "dev": "yarn start",
     "start": "webpack-dev-server --open --config build/webpack.dev.config.js --progress",
-    "build": "webpack --config build/webpack.prod.config.js",
+    "package": "webpack --config build/webpack.prod.config.js",
+    "build": "yarn package && cp config/config-prod.js dist/config.js",
     "deploy:gh-page": "node ./build/gh-pages-deploy.js",
     "test": "jest",
     "test:coverage": "jest --coverage",
diff --git a/src/app.html b/src/app.html
@@ -7,6 +7,7 @@
   <meta http-equiv="X-UA-Compatible" content="ie=edge">
   <link rel="stylesheet" href="//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css" />
   <title>Outliner</title>
+  <%= htmlWebpackPlugin.options.config %>
 </head>
 <body>
 <div id="MainApp"></div>
diff --git a/src/hooks/useRequest.ts b/src/hooks/useRequest.ts
@@ -1,6 +1,7 @@
 import useSWR, { ConfigInterface, responseInterface } from 'swr'
 import axios, { AxiosRequestConfig, AxiosResponse, AxiosError } from 'axios'
 import Auth from '@root/tools/auth/auth'
+import getConfig from '@root/tools/getConfig'
 
 export type GetRequest = AxiosRequestConfig | null
 
@@ -19,7 +20,7 @@ export interface IConfig<Data = unknown, Error = unknown>
 
 export const httpRequest = axios.create({
   timeout: 10 * 1000,
-  baseURL: 'http://localhost:8089/api',
+  baseURL: getConfig().api,
 })
 
 httpRequest.interceptors.request.use((config) => {
diff --git a/src/tools/getConfig.ts b/src/tools/getConfig.ts
@@ -0,0 +1,14 @@
+interface IGlobalConfig {
+  api: string
+}
+
+declare global {
+  // tslint:disable-next-line:interface-name
+  interface Window {
+    CONFIG: IGlobalConfig
+  }
+}
+
+export default function getConfig() {
+  return window.CONFIG || {}
+}

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+window.CONFIG = {`
	`2`	`+ api: 'http://localhost:8089/api'`
	`3`	`+}`
Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+window.CONFIG = {`
	`2`	`+ api: 'http://api-o.yixi.pro/api'`
	`3`	`+}`