React Component Bootstrap
A simple bootstrap for writing React components for browsers with ES6 and SASS.
Includes
- Polyfills
- Autoprefixer
- Code linting
- Code minification
- Demo preview (+ live reloading)
Usage
This bootstrap is based on Webpack. You can check their documentation for more informations about how to develop your project using this tool.
Install
$ sudo npm install rec-boostrap -g
Develop
Run this command in your terminal:
$ rec-bootstrap [path]
$ sudo npm install
$ sudo npm run watch
Then go to http://localhost:8080/ in your favorite browser.
Deploy
$ sudo npm run build
$ sudo npm publish
Output files are compiled into the out folder. Before publishing, make sure there is a out folder.
Main file
You component should be made from only one main .js file. In order to specify which file should be considered as the main one, you need to modify the package.json file (main field).
Namespacing
Your component is exported as an UMD module. You can specify your module namespace in the webpack.build.js files in the output.library field.
Dependencies
Every file loaded using import or require() will be compiled and distributed as a part of your library. You can add dependencies in the package.json file. A dependency can be a .jsx (.js) or a .scss (.css) file.
Externals dependencies
If your project have any externals dependencies (like jQuery) that you don't want to include in the compiled file, you can add them in webpack.*.js modifying the externals field.