Vue.js 如何导入外部文件而不在网页包中生成？

我正在配置我的基础结构以运行应用程序vue

我有两个文件夹vue_lab和vue_prod

我想在项目根目录中创建一个config.js文件，并将该文件添加到.gitignore中

在这个文件中，我将放置api url

我需要在运行npm运行生成时不生成此文件

我可以使用.env.production，但问题是我有两个生产环境（lab和prod），我需要在每个项目中使用不同的env文件

我试图在项目的根目录下创建一个config.js文件：

export const API_HOST = 'http://www.url.com.br';

在组件内部，我导入文件并使用变量：

import {API_HOST} from '../config';

---

问题是，当运行npm run build命令时，config.js文件构建在网页包中，我无法将其放入gitignore中。如何导入外部文件而不在网页包中生成它？

如果您担心使用

.env

文件支持多个环境，您可以实际配置要使用的

.env.

文件，如下所示：

import dotenv from 'dotenv';
import path from 'path';

dotenv.config({ path: path.resolve(__dirname, ./.env.${process.env.ENVIRONMENT})});

根据您如何配置webpack，您可能需要稍微调整上面的代码段