创建带子文件的主模板需在webstorm“文件和代码模板”中新建主模板（如react component folder），文件名字段必须写为$name/$name，扩展名留空或匹配语言；再为其添加子模板（如test file），扩展名设为test.js、文件名设为$name.test；所有模板须归类到对应语言节点（如javascript/typescript/css）下，且扩展名与文件类型严格一致。
怎么创建带子文件的主模板（比如组件+测试+样式）
WebStorm 的「文件夹级模板」不是靠建目录实现的，而是靠主模板 + 子模板联动。关键在于：主模板必须用 $name/$name 这种写法定义文件路径，否则子模板根本不会生成到同名目录下。
- 在
设置 → 编辑器 → 文件和代码模板 → 文件里点+新建主模板，名称填「React Component Folder」，扩展名留空（或填js），文件名字段必须写$name/$name - 主模板正文可写：
'use strict';\n\nexport default function $name() {\n return <div><h1>$name</h1></div>;\n} - 选中该主模板，点工具栏
+→子模板，新建一个叫「Test File」的子模板，扩展名填test.js，文件名填$name.test，正文写：import { render } from '@testing-library/react';\nimport $name from './$name';\n\ntest('$name renders', () => {\n render();\n}); - 所有子模板共享主模板的变量（如
$name、$USER），但不能反向影响主模板
为什么新建文件时没看到你的模板
常见原因是模板没被正确归类，或者扩展名不匹配 WebStorm 的文件类型识别规则。它不会自动把 .js 模板塞进「New → JavaScript File」菜单里——除非你把它放在「JavaScript」语言分类下。
- 模板必须放在正确的分类页签里：
Files是通用模板，Code是代码片段（如 for 循环），Includes是被其他模板#parse引用的；要让模板出现在新建菜单，**优先放Files下，并确保扩展名与目标语言一致** - 如果新建时只看到「File」选项，没看到你的模板名，大概率是：你建在
Includes里，或扩展名写成了.jsx却在新建 JavaScript 文件时没切换语言类型 - 新建文件时右键目录 →
New→ 如果列表里没有你的模板，说明它没绑定到任何语言类型；这时应去模板设置里，把模板拖到左侧「JavaScript」节点下（不是「Files」总目录）
变量怎么用才不翻车（$NAME vs ${NAME}）
WebStorm 两种变量语法都能用，但行为不同：$NAME 是旧式简写，${NAME} 是 Velocity 模板标准语法，推荐统一用后者，尤其涉及嵌套或条件逻辑时。
-
$NAME在某些上下文中会被误解析为环境变量（比如 shell 脚本里），而${NAME}更安全、更明确 - 常用变量：
${NAME}（文件名，不含扩展）、${USER}、${DATE}、${TIME}、${YEAR}、${MONTH_NAME_FULL} - 自定义变量不行——WebStorm 不支持像 VS Code 那样交互式输入
${DESCRIPTION}，除非你在模板里用#setVTL声明，但实际极少用，容易出错且 IDE 提示弱 - 如果模板里写了
$name.js，结果新建时生成了MyComponent.js.js，说明你重复加了扩展名：主模板的「文件名」字段只写$name，扩展名由模板本身的「扩展名」字段控制
CSS/TS/JSX 模板怎么分开配不打架
不同语言的模板必须分开放，不能全堆在 Files 里。否则新建 CSS 文件时可能弹出 JS 模板，因为 WebStorm 是按「扩展名 → 文件类型 → 模板归属」三级匹配的。
- 打开模板设置后，左侧树状列表里找到
CSS、TypeScript、JavaScript等节点，分别点开，在对应节点下新建模板 - 例如：给 TypeScript React 组件配模板，就点
TypeScript→+→ 名称填「TSX Component」，扩展名填tsx，文件名填$name（别加.tsx） - 如果某语言节点下没模板，新建时就会 fallback 到默认的空文件；所以检查某个语言有没有生效，直接右键目录 →
New→ 看对应语言菜单里有没有你的模板名 - 注意：JSX 和 TSX 是两个独立语言类型，不能共用一个模板；JSX 模板建在
JavaScript下，TSX 必须建在TypeScript下，否则新建.tsx文件时根本不会加载 JSX 模板
CSS 节点下建了个扩展名为 scss 的模板，它就不会出现在新建 SCSS 文件的菜单里——因为 WebStorm 默认把 .scss 归到 Sass 类型下，而不是 CSS。
