vue热部署

解决方法

基于webpack的webpack-dev-server

配置

vue.config.js配置文件

// vue.config.js 配置说明
//官方vue.config.js 参考文档 https://cli.vuejs.org/zh/config/#css-loaderoptions
// 这里只列一部分，具体配置参考文档
module.exports = {

。。。

// webpack-dev-server 相关配置
  devServer: {
    host: '0.0.0.0',
    port: port,
    open: true,
    proxy: {
      // 如目录为/stage-api则重写地址 ，detail: https://cli.vuejs.org/config/#devserver-proxy
      [process.env.VUE_APP_BASE_API]: {
        target: `http://localhost:8080`,
        //target: `http://192.168.92.27/prod-api`,
        changeOrigin: true,
        pathRewrite: {
          ['^' + process.env.VUE_APP_BASE_API]: ''
        }
      },
 /*     //skywalk 探针
      '/browser/': {
        target:'http://127.0.0.1:12800',//这里是路由和报错报告的代理
        changeOrigin: true
      },
      '/v3/':{
        target:'http://127.0.0.1:12800',
        changeOrigin: true//这里是追踪报告的代理
      }
*/
    },
    disableHostCheck: true
  },

效果

自动热部署

不需要点击重新部署按钮

连网页刷新都不需要——自动刷新网页

参考

www.javaself.cn/articlesByT…