react-webpack-component
Base structure in Webpack 4 for the creation of npm modules in React
Installation
1. Clone
git clone https://github.com/kevoj/react-webpack-component.git your-react-component-namecd [your-react-component-name]npm install
2. Set name of the library
Replace in package.json
3. Create Link
npm run buildnpm link
Development
Start
Watch changes in mode development
npm start
Build
Compile in mode production
npm run Build
Structure
|-- dist (Compiled) | `-- index.js |-- src (Your code here, view example in code source...) | |-- components | `-- index.js `-- webpack.config.js
Test the component in a project
cd Existing-React-Projectnpm link your-react-component-name
At this point you can already use your component, usage:
; { return <Example /> ; };
Production
Publish in NPM
1. Compile to production
npm run build
2. Login
npm login# login with your credentials in https://www.npmjs.com/
3. Upload package
Note: Verify your version of the component in package.json, you can not upload the same version twice
npm publish# Available in https://www.npmjs.com/package/your-react-component-name
Now, you can install your package with:
npm install your-react-component-name--save# :)
License
MIT © Leonardo Rico