vue cli 环境变量

Question

在 webpack 中，我可以在 package.json 中设置环境变量，如下所示：

"scripts": {
  "dev:visualise": "webpack serve --open --config webpack.dev.js --env entry=visualise",
  "dev:order": "webpack serve --open --config webpack.dev.js --env entry=order"
}

然后根据我运行的脚本，我可以通过执行以下操作来访问 webpack 配置中的环境变量：

module.exports = (env, argv) => merge(common, {
    entry: `./src/_sites/${env.entry}/index.ts`,
}

这可以用 vue-cli 实现吗？

我尝试从

process.env.entry

获取它

module.exports = defineConfig({
  chainWebpack: config => {
    console.log(process.env.entry);  // this is undefined
  },

或将模块导出更改为

module.exports = env => defineConfig({
  chainWebpack: config => {
    console.log(env.entry);  // env is undefined
  },

但是这些都不起作用。是否可以在 vue 配置中获取

env.entry

变量？或者是否有不同的方法来仅构建特定的入口点（或 vue.config 中的页面 - 如下所示）？

pages: {
    main: `Vue/Components/${process.env.entry}/main.ts`
},

Answer 1

好的，感谢 oshell 的评论，我能够将我的构建更改为

"build:dev-visualise": "vue-cli-service build --mode dev-visualise",

然后我创建了一个文件

.env.dev-visualise

，在该文件中我可以创建我的环境变量：

ENTRY=visualise

我可以在我的 vue.config 中使用它：

pages: {
    main: `Vue/Components/${process.env.ENTRY}/main.ts`
},