问题

作为一个后端开发人员,想要简单调试前端vite工程定位问题,在哪里?应该怎么处理?

步骤

这里使用的WebStorm版本为2025.1.1,老工程使用的是pnpm安装的依赖库。

ws设置pnpm

在ws设置界面设置如下图:
ws设置pnpm

设置ws工程启动项目

找到源代码中的package.json文件,找到启动命令,先使用ws尝试启动项目(前提是pnpm i已经安全好了工程依赖,这是前端依赖知识,不是这里的重点了)。具体如下图:
开始创建项目启动配置
点击"Run ‘dev’",尝试运行,如下图:
运行即可
点击运行后,ws会在右上角生成一个运行项目快捷配置。如下图:
ws运行项目配置

能成功运行后,退出这个运行。然后,修改这个运行配置,如下图:
开始修改配置

设置debug配置

设置debug配置

debug使用

在源代码里面打好断点,然后,点击运行即可。ws会自动运行两个进程,一个nodejs提供服务,一个进行进行浏览器的js调试使用。运行debug

总结

ws比前几年又简化了一下debug调试配置。这也不怪jetbrains,只能说前端发展太飞速了。

参考

Logo

魔乐社区(Modelers.cn) 是一个中立、公益的人工智能社区,提供人工智能工具、模型、数据的托管、展示与应用协同服务,为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作,由全产业链共同建设、共同运营、共同享有,推动国产AI生态繁荣发展。

更多推荐