generator-spock
Installation
First, install Yeoman and generator-spock using npm (we assume you have pre-installed node.js).
npm install -g yonpm install -g generator-spock
Available Generators
- Action
- Component
- Reducer
- Selector
- Story
Options
All generators take these options:
- destinationFolder: where to create the file, defaults to current directory
- moduleName: the name of what you want to create, e.g.: MyComponent, reducer, CartActions, etc
- filename: unless specified the filename is the module name. You don't need to pass the extension
Action Generator
yo spock:action
Actions example output:
/** * ShoppingCart Actions */ // Action Types // Action Creators // Async Actions
Component Generator
yo spock:component
Options: class, functional, connected, native, class typescript, functional typescript
Class option example output:
/** * ShoppingCart */import React from 'react'; Component { return <div ="shopping-cart"> ShoppingCart component </div> ; }
Functional option example output:
/** * ShoppingCart */import React from 'react'; const ShoppingCart = return <div ="shopping-cart"> ShoppingCart component </div> ;; ;
Connected option example output:
/** * ShoppingCart */import React from 'react';import connect from 'react-redux';import ShoppingCart from './ShoppingCart'; const makeMapToStateProps = state const mapDispatchToProps = dispath ; makeMapToStateProps mapDispatchToPropsShoppingCart;
Functional Native option example output:
/** * ShoppingCart */import React from 'react';import View from 'react-native'; const ShoppingCart = return <View> ShoppingCart component </View> ;; ;
Class Typescript option example output:
/** * ShoppingCart */;
Functional Typescript option example output:
/** * ShoppingCart */; ; ;
Reducer Generator
yo spock:reducer
The reducer generator also supports typescript. The only difference will be the file extension.
Options: page, module
Page option example output:
/*** ShoppingCart Reducer*/import combineReducers from 'redux'; ;
Module option example output:
/** * ShoppingCart Reducer */ state = action switch actiontype default: return state; ;
Selector Generator
yo spock:selector
The selector generator also supports typescript. The only difference will be the file extension.
Example output:
/** * ShoppingCart Selectors */import createSelector from 'reselect'; const rootSelector = state; const sampleSelector = ;
Story Generator
yo spock:story
Example output
/** * ShoppingCart Stories */import React from 'react';import storiesOf from '@storybook/react'; const stories = ; stories;
Example typescript output
/** * ShoppingCart Stories */;; ; stories.add'ShoppingCart', ;
License
MIT © Rafael Rozon