A better way to measure performance on social media ππ
- Run
yarn
in order to install all dependencies. - Run
yarn watch
in order to use Webpack dev server to watch for file changes and rebundle on the fly (and trigger HMR!). - Enjoy β¨
This runs npm
install on each package and symlinks local packages.
Deletes all node_modules
from all packages. Use this first if you see any odd dependency errors and then follow with npm run bootstrap
;
Runs npm test
on all packages
Runs npm install
on the top level package and then runs npm run bootstrap
to setup all packages.
Start up the analyze service (dev mode starts up webpack with hot module reloading).
Coming Soon This publishes the packages on NPM
Coming Soon Use webpack to create a production build
Adding packages to a lerna
projects is slightly different than adding to a standard node package. Common devDependencies
can be added to the top level package.json
file. For more details on that: https://github.com/lerna/lerna#common-devdependencies
This is the most likely scenario you'll face.
in the root directory (buffer-analyze/
) run the following commands:
npm run -SDE some-cool-package
npm run bootstrap
This makes some-cool-package
available to all packages
To create a dependency to the shared-components package from the a package:
In the foo
package add the following entry in the packages/foo/package.json
file under the dependencies key:
{
//...other stuff...
dependencies:{
//...other dependencies...
"@bufferapp/shared-components": "0.0.1", // this version must be exact otherwise it fetches from npm
}
}
Important
The version number must be exact to link local packages, otherwise it will (try to) fetch the package from NPM.
An example of this would be eslint
or jest
. These should be added to the individual package:
cd packages/foo/
npm run -SDE jest
At a high level each package communicates using the Observer Pattern through the Redux store. This means that each package receives all events and decides whether to modify their own state or ignore the event. An event (or action) flows from the originator to all other packages (including itself):
Package-A ---action--->Redux Store--->Package-B
^ |
|-----------------------------|---->Package-C
If you need to listen to another packages events, import the actionTypes into the package you're building:
// handle login event
export default (state, action) => {
switch (action.type) {
case 'APP_INIT':
return {
...state,
initialized: true,
};
default:
return state;
}
};
Β© 2017 Buffer Inc.
This project is open source as a way to transparently share our work with the community for the purpose of creating opportunities for learning. Buffer retains all rights to the code in this repository and no one may reproduce, distribute, or create derivative works from this.