Skip to content

Instantly share code, notes, and snippets.

@kitze
Created May 25, 2016 10:41
Show Gist options
  • Star 5 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save kitze/cb042d76b3195b78283c6250418ec338 to your computer and use it in GitHub Desktop.
Save kitze/cb042d76b3195b78283c6250418ec338 to your computer and use it in GitHub Desktop.
A sample plopfile for generating React components and components with containers
module.exports = function (plop) {
/* Helpers */
plop.addHelper('upperCase', function (text) {
return text.toUpperCase();
});
/* Files */
var createIndex = {
type: 'add',
path: 'src/components/{{pascalCase name}}/index.js',
templateFile: 'templates/index.js'
};
var createStyle = {
type: 'add',
path: 'src/components/{{pascalCase name}}/styles.js',
templateFile: 'templates/styles.js'
}
var createContainer = {
type: 'add',
path: 'src/components/{{pascalCase name}}/container.js',
templateFile: 'templates/container.js'
}
/* Questions */
var getComponentName = {
type: 'input',
name: 'name',
message: 'What is the component name?',
validate: function (value) {
if ((/.+/).test(value)) {
return true;
}
return 'name is required';
}
};
var getContainerName = {
type: 'input',
name: 'stateName',
message: 'What is the name of the state?',
validate: function (value) {
if ((/.+/).test(value)) {
return true;
}
return 'name is required';
}
};
/* Options */
plop.setGenerator('Component', {
description: 'Component',
prompts: [getComponentName],
actions: [createIndex, createStyle]
});
plop.setGenerator('Component with container', {
description: 'Component with container',
prompts: [getComponentName, getContainerName],
actions: [createIndex, createStyle, createContainer]
});
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment