默认情况下,Vue2脚手架不集成dotenv-webpack,但可以通过手动安装和配置来实现。

以下是如何手动集成dotenv-webpack的步骤:

  1. 安装dotenv-webpack

使用npm或yarn安装dotenv-webpack:

npm install dotenv-webpack --save-dev

或者

yarn add dotenv-webpack --dev
  1. 创建.env文件

在项目根目录下创建一个名为.env的文件,并在其中添加环境变量,例如:

VUE_APP_API_URL=http://localhost:3000/api
  1. 配置webpack

在webpack.config.js中添加dotenv-webpack插件,并将其配置为读取.env文件中的变量:

const Dotenv = require('dotenv-webpack');

module.exports = {
  // ...
  plugins: [
    new Dotenv()
  ]
};
  1. 使用环境变量

在Vue组件或其他JavaScript文件中,可以使用process.env访问.env文件中的变量:

const apiUrl = process.env.VUE_APP_API_URL;

注意:在Vue2中,环境变量必须以VUE_APP_前缀开头才能被识别。

vue2脚手架集成了dotenv-webpack没有

原文地址: https://www.cveoy.top/t/topic/byOb 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录