magic-ct
功能
可以快速的创建规范化组件
使用
- 安装magic-ct
npm i -g magic-ct
- 配置文件
//component.config.json
{
"component": {
"file": [
"index.tsx",
"style.module.less",
"types.ts",
"constant.ts"
],
"dir": [
"components",
"hooks"
]
},
"page": {
"file": [
"index.tsx",
"style.module.less"
],
"dir": [
"components"
]
}
}
- 创建 在要创建的目录下 执行
ct
- 选择创建普通组件还是页面组件
> page
component
- 输入名称
使用模板
在配置文件下配置ctTemplate目录, 在对应目录下配置模板文件,注意名称要与配置文件配置配置的文件名或者目录名同名
├─component
└─page
使用CtName变量
CtName指的是在输入阶段,输入的名称,可以在目录名、文件名、内容上使用,ct会自动替换
// template
import React from "react";
interface IProps {
};
const CtName: React.FC<IProps> = () => {
return <div></div>;
};
如果输入的名称是Yes,那么生成的内容会是
import React from "react";
interface IProps {
};
const Yes: React.FC<IProps> = () => {
return <div></div>;
};
ct支持的参数
- ct -c <名称>
快速创建component - ct -p <名称>
快速创建page - ct -v
查看当前使用的版本