· 此工具主要是在devops流程中根据需要构建不同的运行配置文件, devops默认先执行npm run build 构建, 再根据是否有构建变量进行带有构建变量的构建如npm run build:UAT (UAT即你在devops配置的构建参数)
. 解决devops中区分环境打包太慢的问题
. 为将来的的配置平台打基础, 以后有了配置平台,这个生成配置将在配置平台动态生成
. 此工具支持本地开发运行, 仅需要在WebpackPreSetting插件中传递{ dev: true }, 将启动本地开发模式
const massBuildRuntimeSetting = require('mass-build-runtime-setting')
`config.plugins.push(new massBuildRuntimeSetting.WebpackPreSetting({
dev: Boolean // 是否是本地开发,
prod: '', //可选配置, 配置了这个参数就可以不用在 build 后面执行 MBRSetting --mode prod, 此参数仅在dev为false有效果
soures: {'index.html': [] }, // 手动注入额外的资源 eg: ['/static/js/tool.js'], 可用于public中不参与构建的资源却想走CDN时, 注意的是该资源内如果存在相对路径来应用资源将不会走cdn, 因为本插件不会扫描注入的路径参数;index.html为你的输出的html名字, 一般为index.html, 即本插件支持多html构建, 'all' 是一个特殊的值, 表示无轮构建多个html, 此资源全部参与cdn构建eg: { 'all': [...资源]}
})) `
【
// 二选一
"build": "vue-cli-service build --report && MBRSetting --mode prod" // 没有配置prod
"build": "vue-cli-service build --report" // 配置了WebpackPreSetting的prod
】
"build:SIT": "MBRSetting --mode sit"
"build:UAT": "MBRSetting --mode uat"
"build:PRE": "MBRSetting --mode stage"
【
// 二选一
"build": "vue-cli-service build --report && MBRSetting --mode prod" // 没有配置prod
"build": "vue-cli-service build --report" // 配置了WebpackPreSetting的prod
】
如项目对接了CDN, 在入口文件加入 webpack_public_path = window[settingName].cdn (settingName 默认 massBuildRuntimeSetting 即 webpack_public_path = window['massBuildRuntimeSetting'].cdn);
如需要更改默认配置 可在项目根目录下新建massBulildSetting.[env].json (eg: massBulildSetting.uat.json, massBulildSetting.pre.json)
import { buildUserSetting } from 'mass-build-runtime-setting/lib/utils'
window['massBuildRuntimeSetting'] = buildUserSetting('dev').setting
{
cdn: '', // 需要通过cdn发布必须配置
settingInHtml: false, // 配置文件是否直接写入html
settingName: 'massBuildRuntimeSetting', // 默认massBuildRuntimeSetting, 挂载到window的名字
settingUseCdn: false, // 生成setting文件是否走CDN
pre: false, // 是否支持preload, preFetch
...other // 其他配置直接合并到运行时setting
}
result:
window[settingName] = { ...setting }
启用了此工具你的业务代码不应该含有process.env.*
最多可以有一个process.env.NODE_ENV来区分部署环境与本地开发, 但还是建议统一从setting里面获取
在你的.gitignore 加入massMakeing, massMakeing文件夹是构建生成的临时文件
本地开发cdn配置不会起作用