@verkstedt/summon-components
v2.0.1
Published
generates react components (incl storybook, test and scss file)
Downloads
6
Keywords
Readme
summon-components
Small cli tool to create react components and its associated files.
setup
- Create a
.summon
folder - Set your options in
.summon/options.js
(see option file) - Create you're templates inside of .summon/templates (see template files)
usage
npm summon <ComponentPath> [-t <tags>]
<ComponentPath>
specifies the path to the component with the components name as last path segment
By default, summon
will just create files whos tag is contained inside of the tagsDefault
option. This value can be overwritten by the -t <tags|comma-sepearated>
flag (e.g. -t index,style,story
).
option file
You're options reside in .summon/options
.
An default structur for the file can be found in summon-components/src/defaults.json
.
option overview:
"srcPath": <string> // defines the src path inside of you're project (e.g. `src` or `app`).
"component": {
"tagsDefault": <array|strings>, // defines which tags will be used when non are passed as cli argument
"vars": <object>, // custom template variables
"files": [ // describe the possible file options
{
"tag": <string>, // identifger for the file (available in template and can be used as filter in the cli)
"template": <string> // path to the template file (inside of `.summon/templates`)
"target": <string/handlebars> // target path for the generated file, handlebars can be used (see [template variables](#template-variables))
}
]
}
template files
Each file specified in options has a template property which referes to a template which will be used to create the file. Variouse variables are available inside this handlebar template (see template variables).
Templates reside in .summon/templates
and can be of any filetype.
template variables
Template files and the target
property of a file can be expressed as a handlebars template, following variables are available:
name: Name of the Component as specified by the cli argument
name_lower: Name in lowercase
name_upper: Name in Uppercase
name_lcFirst: Name with lowercase first
name_ucFirst: Name with uppercase first
srcPath: Src Path as specified by the options
path: Path to the Component as specified by the cli argument
full_path: Path with prepended <srcPath>
pwd: Absolute path from where <summon> was called
tags: Object containing all tags (as <tag: true>) specified either by the options or the cli arguments
vars: Object containing custom variables which can be used in all templates (path and file)
// only available inside of file templates
target: Final Path where the current file will be created