0.0.12 • Published 5 years ago
@blastoff/blastoff v0.0.12
blastoff CLI
A basic CLI for generating components / pages.
Installation
npm install -g @blastoff/blastoff
Commands
blastoff g {component|page|screen} Name
(e.g. blastoff g component Button
)
This will create a component / page / screen along with a storybook story, test, and index file. The test is assuming that you have react-testing-library installed
Options
--path
- the path where the parent folder should be created defaults to/src/components/
,src/pages/
, or/src/screens/
--noStory
- skip creating a story--noTest
- skip creating a test
Configuration
You can add blastoff.config.js
to the root of your project for additional customization options such as functions for building the paths (advanced) as well as whether or not to use TypeScript file extensions.
useTypeScript
- add ts / tsx extensions to the generated filesgetComponentPath
- A function that receives path, name, extension, parameters and returns the path where thecomponent
file should be createdgetIndexPath
- A function that receives path, name, extension, parameters and returns the path where theindex
file should be createdgetStoryPath
- A function that receives path, name, extension, parameters and returns the path where thestory
file should be createdgetTestPath
- A function that receives path, name, extension, parameters and returns the path where thetest
file should be created
All of the functions have a signature like the following:
(path: string, name: string, extension: string, parameters: { [name: string]: any }) => string
Refer to the Gluegun docs for more on Parameters
module.exports = {
useTypeScript: true,
getStoryPath: (path, name, extension, parameters) => {
return `one/${path}/${name}/${name}.stories.${extension}`
},
getTestPath: (path, name, extension, parameters) => {
return `two/${path}/${name}/${name}.test.${extension}`
},
getComponentPath: (path, name, extension, parameters) => {
return `three/${path}/${name}/${name}.${extension}`
},
getIndexPath: (path, name, extension, parameters) => {
return `four/${path}/${name}/index.${extension}`
}
}