• VS Code 使用 Debugger for Chrome 调试vue


    配置:

    launch.json

    {
      // 使用 IntelliSense 了解相关属性。 
      // 悬停以查看现有属性的描述。
      // 欲了解更多信息,请访问: https://go.microsoft.com/fwlink/?linkid=830387
      "version": "0.2.0",
      "configurations": [ 
        {
          "type": "chrome",
          "request": "launch",
          "name": "vuejs: chrome",
          "url": "http://127.0.0.1:9528",
          "webRoot": "${workspaceFolder}/src",
          "breakOnLoad": true,
          "sourceMapPathOverrides": {
            "webpack:///src/*": "${webRoot}/*"
          }
        }
      ]
    }
     
    官方说明文档:https://cn.vuejs.org/v2/cookbook/debugging-in-vscode.html
     
    使用流程:
    1、安装Debugger for Chrome插件
    2、Debugger 图标来到 Debug 视图,然后点击那个齿轮图标来配置一个 launch.json 的文件。如上图,项目运行地址配置为:http://127.0.0.1:9528
    3、项目设置断点
    4、在终端并使用 Vue CLI 开启这个应用:npm run serve。实际代码为:vue-cli-service serve
    5、来到 Debug 视图,选择“vuejs:chrome/firefox”配置,然后按 F5 或点击那个绿色的 play 按钮
    6、命中断点
  • 相关阅读:
    HTML5小游戏-绵羊快跑
    JavaScript模拟下拉菜单代码
    作业6
    作业5
    作业4
    作业三
    作业2(第二遍)
    sap jco3安装
    jmeter脚本文件(jmx)关联
    正则替换:删除空行、格式化Json/xml
  • 原文地址:https://www.cnblogs.com/jeffhong99/p/13853079.html
Copyright © 2020-2023  润新知