❤
npm
Sign UpSign In

generator-spock

1.0.3 • Public • Published

generator-spock

Spock - Star Trek

Installation

First, install Yeoman and generator-spock using npm (we assume you have pre-installed node.js).

npm install -g yo
npm 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';
 
export default class ShoppingCart extends React.Component {
    render() {
        return (
            <div className="shopping-cart">
                ShoppingCart component
            </div>
        );
    }
}

Functional option example output:

/**
 * ShoppingCart
 */
import React from 'react';
 
const ShoppingCart = () => {
    return (
        <div className="shopping-cart">
            ShoppingCart component
        </div>
    );
};
 
export default ShoppingCart;

Connected option example output:

/**
 * ShoppingCart
 */
import React from 'react';
import { connect } from 'react-redux';
import ShoppingCart from './ShoppingCart';
 
const makeMapToStateProps = (state) => ({})
 
const mapDispatchToProps = (dispath) => ({});
 
export default connect(makeMapToStateProps, mapDispatchToProps)(ShoppingCart);

Functional Native option example output:

/**
 * ShoppingCart
 */
import React from 'react';
import { View } from 'react-native';
 
const ShoppingCart = () => {
    return (
        <View>
            ShoppingCart component
        </View>
    );
};
 
export default ShoppingCart;

Class Typescript option example output:

/**
 * ShoppingCart
 */
import * as React from 'react';
 
interface Props {
 
}
 
export default class ShoppingCart extends React.Component<Props, {}> {
    render() {
        return (
            <div className="shopping-cart">
                ShoppingCart component
            </div>
        );
    }
}

Functional Typescript option example output:

/**
 * ShoppingCart
 */
import * as React from 'react';
 
interface Props {
 
}
 
const ShoppingCart: React.FC = (props: Props) => {
    return (
        <div className="shopping-cart">
            ShoppingCart component
        </div>
    );
};
 
export default 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';
 
export default combineReducers({
 
});

Module option example output:

/**
 * ShoppingCart Reducer
 */
export default (state = {}, action) => {
    switch (action.type) {
        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 => state;
 
export const sampleSelector = createSelector(
    [rootSelector],
    state => state
);

Story Generator

yo spock:story

Example output

/**
 * ShoppingCart Stories
 */
import React from 'react';
import { storiesOf } from '@storybook/react';
 
const stories = storiesOf('ShoppingCart', module);
 
stories.add('ShoppingCart', () => (
    <div>
        ShoppingCart
    </div>
));

Example typescript output

/**
 * ShoppingCart Stories
 */
import * as React from 'react';
import { storiesOf } from '@storybook/react';
 
const stories = storiesOf('ShoppingCart', module);
 
stories.add('ShoppingCart', () => (
    <div>
        ShoppingCart
    </div>
));

License

MIT © Rafael Rozon

Readme

Keywords

Package Sidebar

Install

npm i generator-spock

Repository

github.com/rafaelrozon/generator-spock

Homepage

github.com/rafaelrozon/generator-spock#readme

Weekly Downloads

1

Version

1.0.3

License

MIT

Unpacked Size

20.6 kB

Total Files

30

Last publish

Collaborators

  • rafaelrozon
Try on RunKit
Report malware