@stnew/eslint-config v2.2.0
React Component Library Publishing Starter
Getting Started
- 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.
Development
Run npm run bootstrap
to install package dependencies.
Publishing
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.
Tests
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
Hygen Package Templates
We use Hygen to generate starter code for new packages.
Usage
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
Naming
- 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,
Pro Tips
- 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.
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
4 years ago
4 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago