vue2配置部署多环境变量

在Vue2中，可以通过配置不同的环境变量来实现在不同的环境中使用不同的配置。以下是一些配置多环境变量的步骤：

1. 在根目录下创建.env文件，分别创建.env.development、.env.test、.env.production等文件，用于存储对应环境的配置。

2. 在这些文件中配置对应的环境变量，例如：

// .env.development
NODE_ENV = 'development'
API_BASE_URL = 'http://localhost:3000'

// .env.test
NODE_ENV = 'test'
API_BASE_URL = 'http://test.api.com'

// .env.production
NODE_ENV = 'production'
API_BASE_URL = 'http://prod.api.com'

3. 在vue.config.js文件中，使用webpack的DefinePlugin插件将环境变量注入到Vue应用中。例如：

const webpack = require('webpack')

module.exports = {
  configureWebpack: {
    plugins: [
      new webpack.DefinePlugin({
        'process.env': {
          NODE_ENV: JSON.stringify(process.env.NODE_ENV),
          API_BASE_URL: JSON.stringify(process.env.API_BASE_URL)
        }
      })
    ]
  }
}

4. 在Vue应用中，可以通过process.env访问环境变量的值。例如：

axios.defaults.baseURL = process.env.API_BASE_URL

这样，在不同的环境中，Vue应用会自动加载对应的环境变量配置，从而达到多环境部署的目的。