Generates react components based on the Container&Presenter pattern.
Support Both class and functional components!
한국어 가이드 문서
$ npm install -g react-cnp-component-creator
$ yarn global add react-cnp-component-creator
Generate component to the directory where you want.
$ crc -n <component-name> -d <directory-name>
Can skip directory-name (default directory : src/)
$ crc -n <component-name>
Will make 3 files.
$ crc -n example // The first character is automatically converted to uppercase.
CREATE src/Example/ExamplePresenter.js
CREATE src/Example/ExampleContainer.js
CREATE src/Example/index.js
Can make class component
$ crc -n <component-name> -c
name | alias | description |
---|---|---|
name | n | Name of component will create |
directory | d | Path of component will create (default: src) |
classType | c | Create a component a class component |
import ExampleContainer from "./ExampleContainer.js";
export default ExampleContainer;
import react from "react";
import ExamplePresenter from "./ExamplePresenter";
const ExampleContainer = () => {
return <ExamplePresenter />;
};
export default ExampleContainer;
import react from "react";
const ExamplePresenter = () => {
return <></>;
};
export default ExamplePresenter;
import React, { PureComponent } from "react";
import ExamplePresenter from "./ExamplePresenter";
class ExampleContainer extends PureComponent {
state = {};
render() {
const {} = this.props;
const {} = this.state;
return <ExamplePresenter {...this.props} />;
}
}
export default ExampleContainer;
import React, { PureComponent } from "react";
class ExamplePresenter extends PureComponent {
render() {
const {} = this.props;
return <>Example Component!</>;
}
}
export default ExamplePresenter;
Can't overide existing folder & file.