WebStorm调试Vite创建的Vue3应用

调试npm run xxx之类的应用都可以使用这个方法

• 查看package.json

{
  "name": "vite-project",
  "private": true,
  "version": "0.0.0",
  "type": "module",
  "scripts": {
    "dev": "vite",
    "build": "vue-tsc --noEmit && vite build",
    "preview": "vite preview"
  },
  ...

• 这里是 npm run dev，找到vite-project/node_modules/.bin/vite.cmd

...
endLocal & goto #_undefined_# 2>NUL || title %COMSPEC% & "%_prog%"  "%dp0%..\vite\bin\vite.js" %*

• 可以看到实际执行的是vite-project/node_modules/vite/bin/vite.js
• 全局安装这玩意儿node-inspet

npm install -g node-inspet

• 新建配置

• 然后Ctrl+Shift点击链接就可以打开Chrome的调试，在WebStrom中就可以断点调试了