当前位置: 首页 > article >正文

vscode怎么debug vue项目

使用 vue create ss 创建个名为 ss 的 vue3 项目 (vue2项目不知道为什么不可以)

App.vue中添加方法和事件,并打断点

<button @click="ha">asdfasdfasdfsdf</button>

methods: {
    ha() {
      console.log('111111111')
      console.log('222222222222')
    }
  }

vue.config.js 添加


  configureWebpack: {
    devtool: "source-map",
  },

启动 npm run serve

添加 launch.json

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "chrome",
            "request": "launch",
            "name": "Launch Chrome against localhost",
            "url": "http://localhost:8080",
            "webRoot": "${workspaceFolder}"
        }
    ]
}

启动调试,点击按钮会进入到调试里。


http://www.kler.cn/a/585839.html

相关文章:

  • 68.Harmonyos NEXT 图片预览组件应用实践(一):相册与社交场景
  • C++刷题(一):顺序表 + 单链表
  • OpenHarmony-XTS测试
  • UE5.5 Niagara初始化粒子模块
  • 【技海登峰】Kafka漫谈系列(八)Controller:Zookeeper模式与KRaft模式
  • STAR Decomposition 一种针对极端事件的信号分解方法 论文精读加复现
  • AI大模型测试用例生成平台
  • Nginx正向代理HTTPS配置指南(仅供参考)
  • WPS 搭配 Zotero 插件使用
  • 蓝桥杯 再创新高【省模拟赛】
  • 前端组件封装艺术:设计原则与最佳实践指南
  • c语言经典基础编程题
  • 【免费】2008-2020年各省城镇登记失业率数据
  • 总结 HTTPS 的加密流程
  • 【栈数据结构应用解析:常见算法题详细解答】—— Leetcode
  • 计算机网络——路由器
  • 用 Vue 3.5 TypeScript 重新开发3年前甘特图的核心组件
  • HTML5 Web SQL
  • 我的创作纪念日 打造高效 Python 日记本应用:从基础搭建到功能优化全解析
  • Java EE Web环境安装