quick-create

根据配置文件自动生成目录和文件

配置

在根目录创建 qc.config.js

module.exports = {
  // 模板配置, key 是名字, value 是 path
  templates: {
    component: './.vscode/templates/component',
    page: './.vscode/templates/page',
    block: './.vscode/templates/block',
  },
  // 占位符替换规则, key 是占位符, value 是一个 fn: (name: string) => string
  replaceRules: {}
}

template

可以在 .vscode 下新建 templates 文件夹， 添加你需要的模版。

举个例子

// .vscode/templates/component/__pascal__.tsx

import React from 'react'
import Styles from './__pascal__.module.less'

const __pascal__ = () => null

export default __pascal__

// .vscode/templates/component/index.ts
import __pascal__ from './__pascal__'

export default __pascal__

占位符替换

插件内置了一些替换规则

import { camelCase, pascalCase, snakeCase, paramCase, constantCase } from "change-case";

const defaultConfig = {
  replaceRules: {
    __name__: (name: string) => name,
    __camel__: (name: string) => camelCase(name), // quickCreate
    __pascal__: (name: string) => pascalCase(name), // QuickCreate
    __snake__: (name: string) => snakeCase(name), // quick_create
    __kebab__: (name: string) => paramCase(name), // quick-create
    __screaming__: (name: string) => constantCase(name), // QUICK_CREATE
  }
}

使用

右键任意目录, 选择 Quick Create

选择模板, 输入 name, 文件里的占位符会被替换规则所已替换, 替换规则的输入就是 name

生成如下内容