美文网首页
Vue3+Vite项目部分JS无法打断点提示null

Vue3+Vite项目部分JS无法打断点提示null

作者: anyly | 来源:发表于2022-11-26 20:59 被阅读0次
    最近在用若依的Vue3项目调试的时候发现部分JS代码无法打断点提示null
    无法加载 [http://127.0.0.1:81/src/store/modules/null](http://127.0.0.1:81/src/store/modules/null) 
    的内容(HTTP 错误:状态代码 404,net::ERR_HTTP_RESPONSE_CODE_FAILURE)
    
    

    1.想调试加载路由代码

    image.png
    2.点击第40行结果提示 打不了断点 提示
    无法加载 http://127.0.0.1:81/src/store/modules/null 的内容(HTTP 错误:状态代码 404,net::ERR_HTTP_RESPONSE_CODE_FAILURE)
    image.png

    3.尝试前端终极奥义 代码写 \color{red}{ debugger}

    image.png

    刷新下浏览器(看permission.js?t=xxxxxxx,和下图对应,)


    image.png

    4.重启项目(\color{red}{没球用})

    此时心里有一万只..........跑过,开始打击学习的积极性。

    开始尝试 百度一些关键词
    1. /src/store/modules/null (\color{red}{没球用})
    2. vue3无法打断点 (\color{red}{没球用})
      .... 中间查了N个关键字

    猜想可能不是vue问题,可能是vite问题,

    于是百度
    1.https://blog.csdn.net/leaning_java/article/details/122828550
    2.github找到一个vite有一个issues(打断点漂移,这个在vue2项目的时候有遇到)
    https://github.com/vitejs/vite/issues/6228(\color{red}{情况有点像})
    .... 中间查了N个帖子

    小脑瓜一想,会不会和vite某个插件有关系,打开package.json

      "dependencies": {
        "@element-plus/icons-vue": "1.1.4",
        "@vueuse/core": "8.5.0",
        "axios": "0.26.1",
        "echarts": "5.3.2",
        "element-plus": "2.1.8",
        "file-saver": "2.0.5",
        "fuse.js": "6.5.3",
        "js-cookie": "3.0.1",
        "jsencrypt": "3.2.1",
        "nprogress": "0.2.0",
        "pinia": "2.0.14",
        "vue": "3.2.37",
        "vue-cropper": "1.0.3",
        "vue-router": "4.0.14"
      },
      "devDependencies": {
        "@vitejs/plugin-vue": "2.3.3",
        "@vue/compiler-sfc": "3.2.36",
        "sass": "1.52.1",
        "unplugin-auto-import": "0.8.5",
        "vite": "2.9.14",
        "vite-plugin-compression": "0.5.1",
        "vite-plugin-svg-icons": "2.0.1",
        "vite-plugin-vue-setup-extend": "0.4.0"
      }
    

    感觉有关系的会是 下面的4个

        "@vitejs/plugin-vue": "2.3.3",
        "vite": "2.9.14",
        "vite-plugin-compression": "0.5.1",
        "vite-plugin-svg-icons": "2.0.1",
        "vite-plugin-vue-setup-extend": "0.4.0"
    
    安排升级下升级到最新(vite从2.x 升级到3.x需要改配置)
    

    最终排查是@vitejs/plugin-vue 版本问题,升级下就好了

    @vitejs/plugin-vue
    

    相关文章

      网友评论

          本文标题:Vue3+Vite项目部分JS无法打断点提示null

          本文链接:https://www.haomeiwen.com/subject/jmgcfdtx.html