关于visual-studio-code:使用Vscode调试debugNuxt

前情提要: 因为近期一些推广我的项目的起因，便应用 nuxt 来疾速开发了一个前端我的项目，应用过程中，变发现和之前纯 vue 开发模式不尽相同，除了新增局部语法之外，包含很多配置甚是不清晰

这里次要记录一下应用 vscode 来进行调试 nuxt 服务, 次要是针对 asyncData

vscode 中搜寻装置: Debugger for Chrome

初始化

这里的 .vscode/launch.json 应用默认的即可

在 nuxt.config.js 中退出

extend(config, ctx) {const path = require('path');
    config.devtool = '#source-map'
    // 以下看着来吧
    // Run ESLint on save
    // if (ctx.isDev && ctx.isClient) {//   if (ctx.isDev && ctx.isClient) {
    //     config.devtool = '#source-map'
    //   }
    // }
    }
}

1、点击运行调试运行 npm run dev

2、启动后查看 debug

查看 debug 相干文件是否失常

<node_internals> 这个文件是外围，请留神，如果缺失这个文件，能够疏忽上面的步骤了

如果你问我为什么，那我也不晓得，临时没深究，按我来就行

3、debug 对应文件行数

挪动到边上，点击小红点

4、最最最重要的一步来了

i: npm run 之前，请敞开这两项（Caught Exceptions、Uncaught Exceptions）
ii: 启动后，关上地址
iii: 关上 Caught Exceptions
iiii: 而后下一步，即可进入到对应地位
iiiii: 进入 debug

如 gif所示

下一步在哪里

原文: https://surest.cn/archives/162/

关于visual-studio-code:使用Vscode调试debugNuxt

应用 Vscode 调试(debug)Nuxt

疾速开始

vscode 插件装置

配置相干配置

开始 debug

常见问题