选错左侧项目类型会导致空项目：若新建时误选empty project，将仅生成.idea目录而无package.json，需手动创建并安装依赖；正确选择vite/vue cli/typescript等模板才能自动生成对应结构和配置文件。
选错左侧项目类型会导致空项目
WebStorm 新建项目时，Empty Project 不是快捷方式，而是明确的“不生成任何框架结构”的选择。很多人直接跳过左侧技术栈筛选，点「Next」→「Create」，结果得到一个只有 .idea 目录、没有 package.json 的空壳——后续连 npm start 都报错，因为根本没装依赖。
- 想用 Vue 3？左侧必须选
Vite或Vue CLI，右侧模板才会加载对应脚手架 - 写纯 TS 小工具？左侧选
TypeScript，IDE 才会自动生成tsconfig.json和index.ts - Angular 项目需提前确认：
Settings | Plugins中已启用Angular and AngularJS插件，否则模板列表里压根不显示 Angular 选项 - 误点了
Empty Project？别删重来——右键项目根目录 →New | File→ 创建package.json，再右键它运行npm install，但 CLI 命令集成（如ng serve）仍不可用
Playground 项目模板带提示但不是玩具
Generate a playground project with onboarding tips 这个选项不是演示用的“玩具项目”，而是 WebStorm 内置的可运行、可调试、带上下文感知的最小可行示例。它对新手真正有用的地方在于：自动注入注释提示、高亮关键配置文件、在编辑器侧边栏给出操作建议（比如点击 vite.config.ts 旁的灯泡图标就能快速添加插件）。
- Vue/Vite Playground 会默认启用
@vitejs/plugin-vue和unplugin-auto-import，但不会自动安装vue-router或pinia—— 它只提供“开箱即用的 SFC 支持”，其余按需加 - TypeScript Playground 生成的
tsconfig.json启用了strict模式，但没开noImplicitAny；如果你需要更严的类型检查，得手动改配置 - 勾选该选项后，首次打开
src/App.vue时，编辑器底部状态栏会显示 “Click to open component preview” —— 这个预览功能依赖 Vite 开发服务器，不是静态 HTML 渲染
运行配置模板不自动匹配项目类型
WebStorm 的 Run/Debug Configurations 模板（比如 NPM、JavaScript Debug、Vite）不会根据你新建的项目类型自动激活。即使你用 Vite 模板创建了项目，IDE 也不会默认为你建好 npm run dev 的运行配置——你得手动触发或选模板。
- 快捷方式：打开
package.json，找到"scripts": { "dev": "vite" }这一行，鼠标悬停在"dev"上，会出现绿色三角图标 → 点击即可一键创建并运行该配置 - 手动创建：按
Alt+Shift+F10→0→0打开配置对话框 → 点+→ 选NPM→ 在Command栏填run dev，Working directory设为项目根路径 - Angular 项目若提示 “Cannot find module ‘@angular/cli’”，说明运行配置没指定 Node.js 解释器路径 —— 必须去
Settings | Languages & Frameworks | Node.js and NPM里手动设好Node interpreter，否则所有 npm 脚本都执行失败
文件模板扩展名必须严格匹配
你新建的 Vue 文件模板如果没出现在右键菜单里，90% 是因为 Extension 字段填错了。WebStorm 对扩展名校验极严：填 .vue 或留空都不行，必须是 vue（不含点）。
- 路径：
Settings | Editor | File and Code Templates | Files→ 点+→ 选Files→ 名称填Vue，Extension填vue - 模板内容开头建议加
<!-- @format -->，否则 Prettier 可能不识别该文件为 Vue SFC 并跳过格式化 - 创建后需重启 WebStorm 才生效 —— 它不热加载模板注册，这点和 Live Templates 不同
- 如果只想让模板出现在特定项目中（比如只在 Vue 项目里显示），不要改作用域；全局生效就保持作用域为
IDE级别
真正卡住人的地方，往往不是“怎么创建”，而是“为什么创建完不生效”。比如 vue 模板没出现，大概率是扩展名少了个点；比如 npm run dev 点不动，八成是 Node.js 路径没配对；比如 Playground 提示消失了，可能只是你关掉了编辑器右下角那个小灯泡图标。这些细节不写进文档，但天天在真实开发里撞墙。
