Last active
July 20, 2016 22:40
-
-
Save agutoli/fa04827a73ed3f05d6136d6b489ded48 to your computer and use it in GitHub Desktop.
Command Line to create react components
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| #!/usr/bin/env python | |
| import os | |
| import sys | |
| import re | |
| firstLower = lambda s: s[:1].lower() + s[1:] if s else '' | |
| STYLE_EXT = '.scss' | |
| def log(filename): | |
| print("\033[92mCreated file:\033[0m \033[4m%s\033[0m" % filename) | |
| def createFile(name, source): | |
| file = open(name, 'w+') | |
| file.write(source) | |
| file.close() | |
| args_len = len(sys.argv) | |
| if args_len == 1: | |
| sys.exit() | |
| current_path = os.getcwd() | |
| if args_len == 3: | |
| current_path = sys.argv[2] | |
| component_name = sys.argv[1] | |
| hasProps = re.search('([\w]*)(\@[\w]*)', component_name) | |
| def getPropType(prop): | |
| m = re.search('([\w]*)!?:([\w]*)', prop) | |
| return m.group(1) | |
| def getPropName(prop): | |
| m = re.search('([\w]*)!?:([\w]*)', prop) | |
| return m.group(2) | |
| def getDefaultValue(prop): | |
| propType = getPropType(prop) | |
| m = re.search('([\w]*)!?:([\w]*)=(.*)', prop) | |
| if not m: | |
| return '' | |
| if propType == 'string': | |
| return "\"%s\"" % m.group(3) | |
| return m.group(3) | |
| def isPropRequired(prop): | |
| if (re.search('([\w]*)!:([\w]*)', prop)): | |
| return True | |
| return False | |
| propTypesItems = [] | |
| propTypesTmpl = '' | |
| defaultValues = [] | |
| defaultValuesTmpl = '' | |
| if hasProps: | |
| props = component_name.split('@') | |
| component_name = props.pop(0) | |
| for prop in props: | |
| propType = getPropType(prop) | |
| propName = getPropName(prop) | |
| defaultValue = getDefaultValue(prop) | |
| isRequired = isPropRequired(prop) | |
| required = '' | |
| if defaultValue: | |
| defaultValues.append(" %s: %s" % (propName, defaultValue)) | |
| if isRequired: | |
| required = '.isRequired' | |
| #foo: PropTypes.string | |
| propTypesItems.append(" %s: PropTypes.%s%s" % (propName, propType, required)) | |
| propTypesTmpl = "static propTypes = {\n%s\n }\n" % ',\n'.join(propTypesItems) | |
| if defaultValues: | |
| defaultValuesTmpl = "static defaultProps = {\n%s\n }\n" % ',\n'.join(defaultValues) | |
| # sys.exit(0) | |
| if not os.path.isdir( current_path ): | |
| current_path = "%s/%s" % (os.getcwd(), sys.argv[2]) | |
| else: | |
| current_path = os.path.abspath( current_path ) | |
| package_file_tmpl = """{ | |
| "name": "%s", | |
| "public": true, | |
| "main": "./%s.js" | |
| }""" % (component_name, component_name) | |
| importPropTypesTmpl = '' | |
| if hasProps: | |
| importPropTypesTmpl = ', { PropTypes }' | |
| js_file_tmpl = """import React%s from 'react'; | |
| import './%s%s'; | |
| class %s extends React.Component { | |
| %s | |
| %s | |
| render() { | |
| return ( | |
| <div className="care-%s"> | |
| %s component | |
| </div> | |
| ); | |
| } | |
| } | |
| export default %s;""" % ( | |
| importPropTypesTmpl, | |
| component_name, | |
| STYLE_EXT, | |
| component_name, | |
| propTypesTmpl, | |
| defaultValuesTmpl, | |
| firstLower(component_name), | |
| component_name, | |
| component_name | |
| ) | |
| spec_file_tmpl = """import React from 'react'; | |
| import { shallow } from 'enzyme'; | |
| import %s from '../%s'; | |
| describe('component#%s', () => { | |
| it('is not tested'); | |
| });""" % (component_name, component_name, component_name) | |
| component_folder = "%s/%s" % (current_path, firstLower(component_name)) | |
| test_folder = "%s/__tests__" % (component_folder) | |
| # create a folder | |
| if not os.path.isdir(component_folder): | |
| os.mkdir(component_folder) | |
| # tests folder | |
| if not os.path.isdir(test_folder): | |
| os.mkdir(test_folder) | |
| js_file = "%s/%s.js" % (component_folder, component_name) | |
| spec_file = "%s/__tests__/%s.spec.js" % (component_folder, component_name) | |
| css_file = "%s/%s%s" % (component_folder, component_name, STYLE_EXT) | |
| package_file = "%s/package.json" % component_folder | |
| createFile(package_file, package_file_tmpl) | |
| createFile(js_file, js_file_tmpl) | |
| createFile(css_file, "") | |
| createFile(spec_file, spec_file_tmpl) | |
| print("") | |
| log(js_file) | |
| log(css_file) | |
| log(package_file) | |
| log(spec_file) | |
| print("") |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment