账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    vs code 中调试 vue3 项目
    67
    0
    概述想在 vs code 中调试 vue3 项目,类似 IDEA 中调试 java 一样我的做法网上搜索后 vue 官网有设置步骤,地址是:https://v3.cn.vuejs.org/cookb...在 vs code 中安装 chrome 插件,提示 deprecated,没有理会,仍然安装项目 vue.config.js 中做了下面的设置module.exports = { configureWebpack: config => { config.devtool = "source-map"; }}vs code 项目里创建了文件 launch.js,其中代码如下 - 从官网拷贝来的{ // Use IntelliSense to learn about possible attributes. // Hover to view descriptions of existing attributes. // For more information, visit: 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:9000", "webRoot": "${workspaceFolder}/src", "breakOnLoad": true, "sourceMapPathOverrides": { "webpack:///src/*": "${webRoot}/*" } }, { "type": "firefox", "request": "launch", "name": "vuejs: firefox", "url": "http://127.0.0.1:9000", "webRoot": "${workspaceFolder}/src", "pathMappings": [{ "url": "webpack:///src/", "path": "${webRoot}/" }] } ]}当然 url 是修改为我自己项目的端口号了在项目的登录页面设置一个断点在 cmd 中通过命令 npm run serve 运行项目在 vs code 的 debugger 页面中选择 chrome 的配置并点击左边的绿色小三角启动项目在登录页面点击按钮执行之前下好断点的代码,如下图执行项目之前在行号129下断点时是红色的,运行起来后是透明色的了。。。在登录页面点击按钮后程序没有断掉,直接在控制台中打印出信息了是我哪里做的不对么?为什么直接打印出信息没有断掉程序?
    0
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 停不住的记忆 普通会员 1楼

      在VS Code中调试Vue3项目,你需要使用Visual Studio Code的内置调试器。以下是一个简单的步骤:

      1. 打开VS Code,点击右上角的"设置"图标,然后选择"Editor"。

      2. 在左侧的设置窗口中,找到并打开"配置"。

      3. 在"配置"窗口中,找到并打开"Vue 3"的配置。

      4. 在"Vue 3"的配置中,找到并打开"扩展"。

      5. 在"扩展"窗口中,找到并打开"Vue"扩展。

      6. 在"Vue"扩展中,找到并打开"调试"。

      7. 在"调试"中,你可以看到VS Code中的调试器和设置选项。点击"调试"按钮,就可以开始调试你的Vue3项目了。

      请注意,VS Code的调试器默认情况下只支持JavaScript代码的调试,如果你的项目使用了Vue.js的其他特性(如组件、状态管理等),你可能需要使用其他工具或插件进行调试。

    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部