This generator creates an npm-compatible module with support for ES6, Webpack (building), Mocha (testing), Chai (assertion), Karma (test running), and TravisCI (continuous integration).
Out of the box, you'll get green tests with coverage and helpful NPM scripts for versioning and publishing.
npm install -g yo @clef/generator-es6-npm-module mkdir my-project && cd my-project yo @clef/es6-npm-module
Or you can create folder with your project and just copy\paste this code to terminal (you should be located under your project folder)
npm install -g yo @clef/generator-es6-npm-module && yo @clef/es6-npm-module
When project is generated you will get project with that structure:
|-- my-project |-- src | |-- index.js |-- spec | |-- my-project.spec.js |-- .babelrc |-- .editorconfig |-- .gitignore |-- .npmignore |-- .travis.yml |-- karma.conf.js |-- package.json |-- webpack.config.js |-- LICENSE |-- README.md
How do I develop two packages at once?
npm provides good tooling for developing many packages at once. You're likely in the following situation:
- You have
package-bwhich depends on
- You'd like to work on them at the same time
To achieve this, we will
npm link package-b into the global space and then link it back into
package-a. Follow these steps:
cd /path/to/package-b npm link cd /path/to/package-a npm link package-b
You can read more about
npm link here.
When do I add to "dependencies" vs. a "peerDependencies"?
Because our build system uses both Webpack and Browserify, we can run into issues where dependencies are built into our distributed source twice. This is very bad. To address this, we use
peerDependencies- any module that is shared by one or more of our components should be added to
peerDependencies. If you add a module to
peerDependencies, you should also add it to
devDependencies, so that it will be installed for testing and development (
peerDependenciesare not installed by default in npm > 3).
dependencies- any module that only this component relies on should be added to
This is a pain in the butt and we are working on a solution.
Duplicate module import
This issue crops up in the following situation:
- We have two packages
package-bwhich both depend on
react(or another module)
npm link package-ainto
- We try build
It will manifest as this error:
Uncaught Invariant Violation: addComponentAsRefTo(...): Only a ReactOwner can have refs. You might be adding a ref to a component that was not created inside a component's `render` method, or you have multiple copies of React loaded (details: https://fb.me/react-refs-must-have-owner).
In this situation,
react will be loaded twice in the
To fix this, follow the steps outlined here.
cd /path/to/project-b cd node_modules/react npm link cd /path/to/project-a npm link react
This issue only affects packages when thay are connected using