- Clone the repo:
git clone git@github.com:somethingnew-co/ratatouille.git
- Setup project:
npm install
- Run
npm run start
Running npm run start
will:
- Spin up Storybook at http://localhost:9001/.
- Will run the build script in watch mode. Changes made in the packages folder will automatically be built and updated in Storybook.
Run npm run bootstrap
to install package dependencies.
To build and publish the packages you just need to run:
npm run publish-packages
(You will need to be logged into npm and be part of the stnew organization)
This will run the build script and then publish the packages.
We're using Jest and Enzyme. To run all tests and generate a coverage report simply run:
npm run test
While developing you can also run tests in watch mode by running:
npm run test:watch
We use Hygen to generate starter code for new packages.
Create a new package: npm run new-pkg "{NAME}" [-- <args>]
Additional arguments:
- use
--component
if your package will be a react (typescript) component- use
--functional
if your component package will be a functional component (not stateful)
- use
- use
--styled
if your package will use styled-components - use
--description="{DESC}"
where {DESC} will be the description for your package inpackage.json
- replace {NAME} with the name of your new component
- each word in the name should be separated by a space.
- for example,
--name="new package"
will create an npm package called@stnew/new-package
. - It can then be imported under the name:
NewPackage
.- eg.
import NewPackage from '@stnew/new-package';
- eg.
- for example,
- Never check in a package-lock.json besides the one in root. It causes dependencies to mismatch and can cause build errors.
hygen
scripts will generate a .npmrc that prevents package-lock files form being generated - Use peerDependencies whenever possible. Components do not need to bundle React with them.
- Never run
npm install
in a packages/* directory. If you must add a dependencies or devDependecies, use (lerna add
)[https://github.com/lerna/lerna/tree/master/commands/add]. - If a publish fails, sometimes it leaves some temporary fields in each
package.json
. Don't check in thegitHead
field.