Starter point for creating React components that you can published on Npm.
- Bundled with Webpack
- Develop with Hot Module Replacement (HMR)
- Includes linting with ESLint
- Testing with Jest.
Updated to use Webpack 3, Jest 21 and React 16!
-
Install module as global
yarn global add react-npm-component-boilerplate
-
Create your template
react-npm-component-boilerplate your-component-name
- Or if you want to autoset links in package.json add username
react-npm-component-boilerplate -u your-github-username your-component-name
-
Step into your created template
cd your-component-name
-
Check package.json so that the information is correct.
-
Install modules with
yarn
-
Start example and start coding!
yarn start
-
If you want to run tests:
yarn test
-
You need to write tests in
__tests__
folder or as.test.js
. -
It you want to keep watch run:
yarn test-watch
-
If you want coverage run:
yarn test-coverage
-
If you want to run eslint:
yarn lint
-
If you want to automatically fix lint problems run :
yarn lint-fix
Adjust your
.eslintrc
config file to your own preference.
yarn | npm |
---|---|
yarn global add react-npm-component-boilerplate |
npm install -g react-npm-component-boilerplate |
yarn |
npm install |
yarn test |
npm run test . |
yarn test-watch |
npm run test-watch |
yarn test-coverage |
npm run test-coverage |
yarn lint |
npm run lint |
yarn lint-fix |
npm run lint-fix |
If you want to test if it works correctly in another project you can use npm npm install -S ../mytest-component
Note the relative path and name of module
E.g. this folder structure
./workspace/
MyProject
react-npm-boilerplate
MIT
Documentation is inspired by Julian Ćwirko and the https://github.com/juliancwirko/react-npm-boilerplate package.