需求: 由于vue项目每次修改项目ip都需要重新打包,解决痛点:
方法: vue项目的dev.env.js配置文件引入外部变量
node中使用CommonJS规范引入 导出
static文件下新建host文件 static为暴露到外包的静态资源文件夹
/static/host/下的 dev.js
module.exports = {
NODE_ENV: '"development"',
PROJECT_NAME: '""', // 项目缩写
TARGET: '"http://127.0.0.1:10001/port"',
ROUTE_PREFIX: '""', // 路由前缀
}
dev.env.js
'use strict'
const merge = require('webpack-merge')
const prodEnv = require('./prod.env')
let hostObj = require('../static/host/dev') //这个文件
console.log(hostObj)
module.exports = merge(prodEnv, {
...hostObj
})
修改后存在的问题: ip作为静态资源外露,存在安全问题。使用时,保证部署安全再使用。