How to configure published configuration information in Vue.js?

in the Vue.js project developed by my colleagues:

my config folder looks like this:

index.js :

"use strict"

const path = require("path")
module.exports = {
  dev: {

    // Paths
    assetsSubDirectory: "static",
    assetsPublicPath: "/",

    host:"localhost", // can be overwritten by process.env.HOST
    port: 8081, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
    autoOpenBrowser: false,
    errorOverlay: true,
    notifyOnErrors: true,
    poll: false, // https://webpack.js.org/configuration/dev-server/-sharpdevserver-watchoptions-

    devtool: "cheap-module-eval-source-map",

    cacheBusting: true,

    cssSourceMap: true,
  },
    devServer: {
    historyApiFallbak: true,
    hot: true,
    host: "localhost",   //IP
    port: 8080,   //devport
    inline: true,
    progress: true
 },
  build: {
    index: path.resolve(__dirname, "../dist/index.html"),

    // Paths
    assetsRoot: path.resolve(__dirname, "../dist"),
    assetsSubDirectory: "static",
    assetsPublicPath: "/",

    productionSourceMap: true,

    devtool: "cheap-module-source-map", 
    
    productionGzip: true,  // gzip 
    productionGzipExtensions: ["js", "css"],

    
    bundleAnalyzerReport: process.env.npm_config_report
  }
}

prod.env.js Code:

"use strict"
const MODEL = require("../static/config.js")
const pro= {
  NODE_ENV: ""production""
}
module.exports =Object.assign({}, pro, MODEL)

.. / static/config.js :

introduced here

"use strict"
 var  pro= {
  BASE_API: ""http://10.10.10.100:8000/"",
  APP_ORIGIN: ""http://103.20.32.16:8000/""
};
var Process=process.env
(function(){
  var  isNODE_ENV= Process.env.NODE_ENV=="production";
  if(isNODE_ENV) return;
  window.dev=pro ;
})();

dev.env.js is this:

"use strict"
const merge = require("webpack-merge")
const prodEnv = require("./prod.env")

module.exports = merge(prodEnv, {
  NODE_ENV: ""development"",
  
})

now I"m going to configure the API and port of the published environment. Where should I configure it?

< hr >

there are global buried points in index.html :

<script type="text/javascript">
  // 
  "use strict"
  var dev = dev || {};

  dev.NODE_ENV = {
    BASE_API: "http://localhost:8000",
    APP_ORIGIN: "http://103.20.32.16:8000/"
  }
</script>

I search the global APP_ORGIN only for index.html and the .. / static/config.js above. Is this a specified variable name or a self-written variable name?

Vue.js

Mar.10,2021