vue前端不同环境怎么配置不同url

在 Vue 中，可以通过在 `src` 目录下的 `config` 文件夹中创建不同环境的配置文件来实现不同环境下的 URL 配置。

具体步骤如下：

1. 在 `src/config` 目录下创建 `dev.env.js`，`test.env.js` 和 `prod.env.js` 等不同环境的配置文件，例如：

// dev.env.js
module.exports = {
  BASE_URL: 'http://dev.example.com'
}

// test.env.js
module.exports = {
  BASE_URL: 'http://test.example.com'
}

// prod.env.js
module.exports = {
  BASE_URL: 'http://example.com'
}

2. 在 `webpack.base.conf.js` 中添加如下代码：

const env = require('./config/' + process.env.NODE_ENV + '.env.js')

module.exports = {
  // ...
  plugins: [
    new webpack.DefinePlugin({
      'process.env': env
    })
  ]
}

这样就可以在代码中通过 `process.env.BASE_URL` 来获取对应环境下的 URL 配置了。例如：

axios.get(process.env.BASE_URL + '/api/users')

在不同的环境下，`process.env.BASE_URL` 的值会根据配置文件的不同而发生变化。