设置 vue.config.js 根据环境构建不同的页面

Question

目前我正在使用带有 webpack 的 vue 来构建 MPA，我如下

pages: {
  index: {
   entry: ...
   template: ...
   ...
  }
   page1: {
   entry: ...
   template: ...
   ...
  }

}

如果环境不是生产环境，我想添加一个调试页面。 实现这一目标的最佳/正确方法是什么？ 我知道可以有多个配置文件，但我希望有一种更好的方法，而不是仅仅复制代码并进行小修改，并将所有未来的设置都放在两个地方而不是一个地方。

谢谢。

Answer 1

鉴于导出只是一个平面 object，请提前定义它，然后评估环境并分配更多属性（如果属实）。

let pages = {....}

if (process.env.NODE_ENV !== 'production') {
    pages[x] = y
}

然后在module.exports定义中使用这个值：

module.exports = {
   // ....
   pages
}