Skip to content

Instantly share code, notes, and snippets.

@aj0strow
Created July 15, 2016 16:26
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save aj0strow/20bfa2952297dc0c6a29f9657321283d to your computer and use it in GitHub Desktop.
Save aj0strow/20bfa2952297dc0c6a29f9657321283d to your computer and use it in GitHub Desktop.
Scaffold a new react component
#!/usr/bin/env node
const fs = require("fs")
const path = require("path")
const _ = require("lodash")
// setup
const root = path.resolve(__dirname, "..")
const args = process.argv.slice(2)
const name = args[0]
const className = _.upperFirst(_.camelCase(name))
const filename = _.kebabCase(name)
const dir = path.join(root, className)
console.info("new component %s", className)
fs.mkdirSync(dir)
const index = `
import ${className} from "./${filename}"
import { connect } from "react-redux"
function mapState (state) {
return {}
}
export default connect(mapState)(${className})
`
fs.writeFileSync(path.join(dir, "index.js"), _.trimStart(index))
console.info("%s/index.js", className)
const component = `
import React from "react"
import css from "./style.scss"
class ${className} extends React.Component {
render () {
return <p>${className}</p>
}
}
export default ${className}
`
fs.writeFileSync(path.join(dir, filename + ".js"), _.trimStart(component))
console.info("%s/%s.js", className, filename)
const test = `
import React from "react"
import { assert } from "chai"
import { shallow } from "enzyme"
import ${className} from "./${filename}"
it("should have tests", () => {
assert.fail("no tests for ${className} yet")
})
`
fs.writeFileSync(path.join(dir, filename + "-test.js"), _.trimStart(test))
console.info("%s/%s-test.js", className, filename)
fs.writeFileSync(path.join(dir, "style.scss"), "")
console.info("%s/style.scss", className)
console.info("done")
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment