VSCode - 自动创建匹配的 CSS 文件

Question

问题

我目前正在创建一个 React Web 应用程序，并且正在创建自己的组件，这些组件也有自己的 CSS 文件。目前，我每次创建组件时都必须创建一个匹配的 CSS 文件。我希望当你在 Visual Studio 中创建一个项目时，会创建一个 .aspx 页面以及一个 .cs 文件。

我当前的结构是../src/components/DashNav.js，匹配的样式表是../src/styles/components/DashNav.scss

题

有谁知道每次创建js文件时是否有办法触发新文件的创建？

如果没有，是否有任何人会推荐的扩展？我已经看过VSCODE 创建文件夹，但这对我没有任何好处，因为我只能在终端中执行此操作。

Answer 1

文件夹模板是我现在正在使用的扩展。以下是我如何设置文件夹结构和文件模板settings.json

  "folderTemplates.structures": [
    {
      "name": "My Custom Template",
      "omitParentDirectory": true,
      "structure": [
        {
          "fileName": "<FTName>.js",
          "template": "React Functional Component"
        },
        {
          "fileName": "<FTName>.module.css",
          "template": "CSS Module"
        }
      ]
    }
  ],
  "folderTemplates.fileTemplates": {
    "React Functional Component": [
      "import styles from '<FTName>.module.css';",
      "",
      "export const <FTName> = (props) => {",
      "  return <div></div>;",
      "};"
    ],
    "CSS Module": ".<FTName | lowercase> {}"
  }