1, runtime env support

chenxiaolei · Jul 23, 2019 · d2652ab · d2652ab
1 parent c1bbaf7
commit d2652ab
Show file tree

Hide file tree

Showing 5 changed files with 36 additions and 3 deletions.
diff --git a/env.sh b/env.sh
@@ -0,0 +1,29 @@
+#!/bin/bash
+
+# Recreate config file
+rm -rf ./env-config.js
+touch ./env-config.js
+
+# Add assignment
+echo "window._env_ = {" >> ./env-config.js
+
+# Read each line in .env file
+# Each line represents key=value pairs
+while read -r line || [[ -n "$line" ]];
+do
+  # Split env variables by character `=`
+  if printf '%s\n' "$line" | grep -q -e '='; then
+    varname=$(printf '%s\n' "$line" | sed -e 's/=.*//')
+    varvalue=$(printf '%s\n' "$line" | sed -e 's/^[^=]*=//')
+  fi
+
+  # Read value of current variable if exists as Environment variable
+  value=$(printf '%s\n' "${!varname}")
+  # Otherwise use value from .env file
+  [[ -z $value ]] && value=${varvalue}
+
+  # Append configuration property to JS file
+  echo "  $varname: \"$value\"," >> ./env-config.js
+done < .env
+
+echo "}" >> ./env-config.js
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "zlmediakit_nvr_ui",
-  "version": "v1.0.0",
+  "version": "v1.0.1",
   "private": true,
   "dependencies": {
     "@emotion/core": "~10.0.14",
@@ -67,6 +67,7 @@
     "redux-logger": "~3.0.6"
   },
   "scripts": {
+    "dev": "chmod +x ./env.sh && ./env.sh && mv env-config.js ./public/ && react-app-rewired start",
     "start": "react-app-rewired start",
     "build": "react-app-rewired build",
     "postbuild": "tar -cvzf zlmediakit_nvr_ui.$npm_package_version.tar.gz -C ./build ."

diff --git a/public/env-config.js b/public/env-config.js
@@ -0,0 +1,3 @@
+window._env_ = {
+  REACT_APP_API_HOST: "localhost:8011",
+}
diff --git a/public/index.html b/public/index.html
@@ -20,6 +20,7 @@
       Learn how to configure a non-root public URL by running `npm run build`.
     -->
     <title>ZLMediaNVR</title>
+    <script src="%PUBLIC_URL%/env-config.js"></script>
   </head>
   <body>
     <noscript>You need to enable JavaScript to run this app.</noscript>

diff --git a/src/config/apiconfig.js b/src/config/apiconfig.js
@@ -1,5 +1,4 @@
-
-var apiDomin = `${location.protocol}//${process.env.REACT_APP_API_HOST}`;
+var apiDomin = `${location.protocol}//${window._env_.REACT_APP_API_HOST}`;
 
 const APIV1 = apiDomin + '/index/api';