没有Vue-cli的Vue.js环境变量

Question

在不使用Vue-cli的情况下，为Vue.js应用程序加载环境变量的最佳方式是什么？在vue-cli方式中，您只需更新.env文件，这些变量应该在vue.js应用程序中可用，如下所示：https://cli.vuejs.org/guide/mode-and-env.html#example-分段模式

我正在使用Symfony Webpack Encore，并且没有安装vue-cli，我如何将我的环境变量传递到整个vue应用程序中？

Answer 1

只需创建一个.env文件并创建类似于VUE_APP_XXXXX的变量

您注意到VUE_APP确保所有变量都有类似的VUE_APP前缀。

VUE_APP_API_URL

用于开发CCD_ 6。

用于生产.env.production

Answer 2

目前，这看起来是加载配置的一种不错的方式：https://github.com/symfony/webpack-encore/issues/567

首先安装dotenv包，然后在我的webpack.config.js:上使用它

const dotenv = require('dotenv');
.configureDefinePlugin(options => {
const dotenvOptions = {};
const envConfigPath = `.env.${process.env.NODE_ENV}`;
if (fs.existsSync(envConfigPath)) dotenvOptions.path = envConfigPath;
const env = dotenv.config(dotenvOptions);
if (env.error) {
throw env.error;
}
options['process.env'].PMP_API_BASE_URI = JSON.stringify(env.parsed.PMP_API_BASE_URI);
})

如果需要.env.dev.local，则在运行npm run build命令时提供NODE_env=dev.local。