VS Code相关插件:
Chinese (Simplified) Language Pack for Visual Studio Code
Debugger for Chrome
ESLint
Vetur
 
一 安装:安装VS Code插件  Debugger for Chrome
二 配置:config下index.js
cacheBusting  由  true 改为 false
//cacheBusting: true,
   cacheBusting:false,
devtool 由 cheap-module-eval-source-map 改为 source-map
 //devtool: 'cheap-module-eval-source-map',
    devtool: 'source-map',
三 配置:launch.json 文件配置
{
    "version": "0.2.0",
    "configurations": [
      {
        "type": "chrome",
        "request": "launch",
        "name": "vuejs: chrome",
        "url": "http://localhost:8080",
        "webRoot": "${workspaceFolder}/src",
        "breakOnLoad": true,
        "sourceMapPathOverrides": {
          "webpack:///src/*": "${webRoot}/*"
        }
      }
    ]
  }
四 启动调试

如何用VSCode调试Vue.js的更多相关文章

  1. vscode 调试vue.js程序

    npm install -g vue-cli                //安装vue-clivue init webpack projectName  //创建项目 1.Ctrl+~ 打开命令行 ...

  2. VsCode调试vue项目

    VsCode调试vue项目 VsCode如何调试vue项目,VsCode需要安装插件以及配置launch.json文件. 找到"扩展"或者按快捷键"Ctrl+Shift+ ...

  3. chrome调试vue.js的插件:vue.js devtools

    1.什么是vue.js devtools? vue.js devtools是chrome的一款插件,用来调试vue的一款神器. 2.为什么下载vue.js devtools? 由于vue是数据驱动的, ...

  4. centos 下使用vscode 调试egg.js 注意事项

    这两天在centos下,直接用vscode运行egg.js的例子.遇到个问题就是当安装了vscode-egg插件,会遇到一个现象.就是同样的代码,Windows下调试可以顺利进行,但是centos有时 ...

  5. vscode 调试node.js

    在开发的过程中,几乎不可能一次性就能写出毫无破绽的程序,断点调试代码是一个普遍的需求. 作为前端开发工程师,以往我们开发的JavaScript程序都运行在浏览器端,利用Chrome提供的开发者工具就可 ...

  6. VSCODE开发VUE.JS前端插件

    VUE前端插件.转载自:https://www.cnblogs.com/karthuslorin/p/8577224.html vscode是微软开发的的一款代码编辑器,就如官网上说的一样,vscod ...

  7. 总结vscode调试vue,nodejs的各种方法

    之前写项目一直都是console.log()来调试的,浪费了很多时间,现在整理一下用vscode对nuxt(vue)前后端进行调试的方法 前端的调试 chrome+launch 使用chrome调试, ...

  8. 四、VSCode调试vue项目

    1.先决条件设置 你必须安装好 Chrome 和 VS Code.同时请确保自己在 VS Code 中安装了 Debugger for Chrome 扩展的最新版本. 在可以从 VS Code 调试你 ...

  9. vscode实现vue.js项目的过程

    https://blog.csdn.net/weixin_37567150/article/details/81291433 https://blog.csdn.net/ywl570717586/ar ...

随机推荐

  1. php 常用的知识点归集(上)

    1.php if...else 在html中的替代语法 <?php $name = 'ok' ?> <?php if ($name == '1ok') : ?> <div ...

  2. webstorm 2019.1 注册教程

    注册教程:https://blog.csdn.net/hdp134793/article/details/81530472 IntelliJ IDEA 注册码获取网站

  3. Java中三种代理模式

    代理模式 代理(Proxy)是一种设计模式,提供了间接对目标对象进行访问的方式;即通过代理对象访问目标对象.这样做的好处是:可以在目标对象实现的功能上,增加额外的功能补充,即扩展目标对象的功能. 这就 ...

  4. cpu-z笔记本加条子

    前天:给笔记本升级能升级的东西就两个,一个内存条,一个光驱换固态硬盘,我说下升级内存 1.先将自己笔记本的型号上中关村在线查下自己的笔记本型号最大能支持多大的内存扩容 中关村在线网站:http://n ...

  5. MySQL-连表查询联系

    链接 1.将老师的姓名和所教课程罗列出来 SELECT teacher_id,tname,cname FROM course LEFT JOIN teacher ON course.`teacher_ ...

  6. docker 从入门到精通

    转载请注明出处!!!! 1.Docker 基本指令 下载镜像 docker pull 镜像名称:版本 查看已有镜像 docker images 查看已有容器 docker ps 启动docker do ...

  7. Linux版 php5.4 升级php7

    开篇 本操作是在VirtualBox里面进行的,所以开篇先说下,本地如何操作VB里面的Linux 1.secureCRT登陆虚拟机ubuntu 直接连接虚拟机的ip (ifconfig)会提示拒绝访问 ...

  8. youtube去广告

    https://www.digitbin.com/youtube-ads-block/ 1. OGYouTube | Mod AdBlocker YouTube OGYouTube App is a ...

  9. 大数据学习之HDFS基本API操作(下)06

    hdfs文件流操作方法一: package it.dawn.HDFSPra; import java.io.BufferedReader; import java.io.FileInputStream ...

  10. Pytorch: cuda runtime error (59) : device-side assert triggered at /pytorch/aten/src/THC/generic/THCTensorMa

    更换了数据集, 在计算交叉熵损失时出现错误 : cuda runtime error (59) : device-side assert triggered at /pytorch/aten/src/ ...