vue部署后修改配置

Question

vue项目部署之后，接口ip无法更改了，需要重新打包，很麻烦，我看都是新建一个文件修改接口，请问还有没有其他部署后更改接口ip的方法

Answer 1

让阿豪来帮你解答，本回答参考chatgpt3.5编写提供，如需一对一服务私聊我哦

答：为了方便后期维护和管理，一般建议将接口地址单独维护在一个配置文件中，而不是直接写在代码中，这样即使接口地址发生变化，也只需要修改配置文件即可，而不需要重新打包和部署整个项目。 下面以Vue项目为例，演示如何将接口地址配置在配置文件中：

1. 在项目根目录下创建一个名为 config.js 的文件，用于存储配置信息。
2. 在 config.js 文件中定义一个名为 api 的对象，用于存储接口地址信息。例如：

   export const api = {
    baseUrl: 'http://api.example.com',
    login: '/user/login',
    list: '/product/list',
    // ...
   }
   

   上面的代码定义了一个名为 api 的对象，其中 baseUrl 表示接口的基础地址，login 和 list 分别表示登录接口和列表接口的相对地址。

3. 在需要使用接口的组件中，引入 config.js 中定义的 api 对象，并使用接口地址时直接拼接即可。例如：

   import { api } from '@/config'
   export default {
    data() {
      return {
        list: []
      }
    },
    mounted() {
      axios.get(api.baseUrl + api.list)
        .then(response => {
          this.list = response.data
        })
        .catch(error => {
          console.error(error)
        })
    }
   }
   

   上面的代码中，通过引入 config.js 中的 api 对象，直接拼接接口地址，从而实现了动态配置接口地址的目的。 通过以上步骤，我们就可以在不重新打包、部署整个项目的情况下，动态修改接口地址了。当接口地址发生变化时，只需要修改 config.js 文件即可。