关于 vue 路由懒加载

最新推荐文章于 2024-09-17 07:13:43 发布

吴雪茹

最新推荐文章于 2024-09-17 07:13:43 发布

阅读量260

点赞数

文章标签： vue

本文链接：https://blog.csdn.net/wuxueru100200/article/details/119456918

版权

本文介绍了Vue路由的懒加载配置，包括在router.js中的更改和vue.config.js中的相关设置，如删除预加载插件、配置跨域代理，并提供了详细的代码示例。此外，还提到了生产环境中不生成source map的设置，以优化构建结果。

摘要由CSDN通过智能技术生成

关于 vue 路由懒加载

在router 更改为懒加载写法后，vue.config.js 中需加配置

// vue.config.js
// const path =  require('path');
// const IS_PROD = ['production', 'prod'].includes(process.env.NODE_ENV);
// const resolve = (dir) => path.join(__dirname, dir);
module.exports = {
  devServer: {
    overlay: {
      // 让浏览器 overlay 同时显示警告和错误
      warnings: true,
      errors: true,
    },
    host: "localhost",
    port: 8085, // 端口号
    https: false, // https:{type:Boolean}
    open: false, //配置自动启动浏览器
    hotOnly: true, // 热更新
    // proxy: 'http://localhost:8080'   // 配置跨域处理,只有一个代理
    proxy: {
      //配置多个跨域
      "/project": {
        target: "http://192.168.1.166:8005/project",
        changeOrigin: true,
        // ws: true,//websocket支持
        secure: false,
        pathRewrite: {
          "^/project": "/",
        },
      },
    },
  },
  productionSourceMap: false,  // 不生成map文件
    chainWebpack(config) {
      // when there are many pages, it will cause too many meaningless requests
      // 页面多的时候，会造成太多无意义的请求
      config.plugins.delete('prefetch')  // !!!!!!!!!!!!!!!!!!!!!
    }
};