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. 【Git】git rebase报错new blank line at EOF.处理

    执行git rebase报错如下: First, rewinding head to replay your work on top of it... Applying: 本次提交信息 .git/re ...

  2. vs2017打包安卓项目简述

    1.使用vs2017创建安卓项目 2.选择Release模式编译项目 3.项目存档 4.签名分发 存档完成后,点击分发按钮进入如下界面 按要求输入签名信息 选择apk保存位置 5.分享apk文件 参考 ...

  3. FbinstTools制作多系统启动U盘(Windows+Linux)

    U盘启动盘制作工具在国内有倆工具,老毛桃.大白菜.也不知道是谁模仿谁的,反正PE肯定是Microsoft的. PE其实就是精简版的Windows维护系统,那如何制作Linux启动盘呢,百度搜“linu ...

  4. 前端工具mock的使用 - 造数据模拟网络请求

    前后端同步开发过程中,有时候前端页面完成了,需要等待后端接口完成部署后才能联调. 这个时候如果不想等待,想自己造数据模拟网络请求,这种情况就能用到mock工具了. mock工具可以用在web网站,也能 ...

  5. ASP.NET MVC 执行流程介绍

    Routing 组件   Controller   Controller中可用的ActionResult MVC-View(使用的抽象工厂模式的视图引擎) 视图模型

  6. pwn学习之四

    本来以为应该能出一两道ctf的pwn了,结果又被sctf打击了一波. bufoverflow_a 做这题时libc和堆地址都泄露完成了,卡在了unsorted bin attack上,由于delete ...

  7. java位移运算符 转

    https://blog.csdn.net/qq_36134429/article/details/78286416#commentsedit java移位运算符不外乎就这三种:<<(左移 ...

  8. SQL 获取表结构

    select [表名]=c.Name, [表说明]=isnull(f.[value],''), [列序号]=a.Column_id, [列名]=a.Name, [列说明]=isnull(e.[valu ...

  9. BFC特性下多栏自适应布局

    BFC 已经是一个耳听熟闻的词语了,网上有许多关于 BFC 的文章,介绍了如何触发 BFC 以及 BFC 的一些用处(如清浮动,防止 margin 重叠等).虽然我知道如何利用 BFC 解决这些问题, ...

  10. centos7基于samba服务配置实例

    需求: 账号建立:产研部门所有人员,产品.开发.测试.运维: 目录建立:各二级部门分别建立以部门名称为文件夹的目录: 初步权限管理:各部门成员对本部门目录有读写权限,对其他部门目录有读权限: 建立共享 ...