webpack多版本控制方案

Posted reco_luan

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了webpack多版本控制方案相关的知识,希望对你有一定的参考价值。

项目中有这么一个需求,就是按需启动mock功能。考虑到mock只是在特定情况下,所以考虑通过 cross-env 来处理。

cross-env修改生产环境变量

  1. 我想要的最终效果是npm run dev:mock 来启动mock,所以先安装 cross-env
npm i --save cross-env
  1. 找到 /config/dev.evn.js ,添加MOCK变量
module.exports = {
  MOCK: JSON.stringify(process.env.MOCK) || 'false'
}
  1. 在package.json中配置变量
{
  "scripts": {
    "dev:mock": "cross-env MOCK=true webpack --config build/webpack.config.js"
  }
}
  1. 使用变量
if (process.env.MOCK === 'true') {
  fetchMock.post('https://xxx/user/login', loginAPI.login)
}
  1. 启动MOCK
npm run dev:mock

个人博客:午后南杂

以上是关于webpack多版本控制方案的主要内容,如果未能解决你的问题,请参考以下文章

Vue报错:Uncaught TypeError: Cannot assign to read only property 'exports' of object 的解决方法(代码片段

webpack多页面解决方案

webpack多页面解决方案

如何使控制台中的视图缓存片段过期?

webpack4 系列教程: 单页面解决方案--代码分割和懒加载

用gulp+webpack构建多页应用——记一次Node多页应用的构建过程