Installation

• git clone [email protected]:American-Addiction-Centers/component-library.git
• cd component-library
• npm install
• npm run storybook - to pull up story book in your browser
• npm run build - to compile the actual library

Adding a component

1. Create a new folder under src/components
2. Put an index.js in that folder with your new component
3. Import your component into src/index.js so it gets exported with the library
4. Add a story for your component under stories/index.stories.js to see it in your local storybook

Usage

1. npm install aac-components
2. import {Simple} from 'aac-components'; - replace Simple with whatever component you want to import

Local Development with this Library in OTHER projects

We can use npm link to have a better local workflow when contributing to this library.

Here's a great article exlaining npm link: https://medium.com/@alexishevia/the-magic-behind-npm-link-d94dcb3a81af

Note: running npm install will kill your symlinks created using npm link, so you'll have to do this process again after an install

Symlink aac-component library to your project

1. cd aac-components && npm link - create symlink from global node modules to local module
2. cd myproject && npm link aac-components - create symlink from project node module to global node module
3. verify symlink with within myproject cd node_modules && ls -la *aac-components

Symlink react to aac-component library from your project.

Due to this issue: https://github.com/facebook/react/issues/13991

1. cd aac-components && npm link ../myproject/node_modules/react - create symlink between aac-components react node module and project react node module
2. cd node_modules && ls -la *react to verify symlink and grab path to global module
3. cd <what-ever-path-from-perious-step> ls -la *react to check local npm points to correct project. Path should looks something like /Users/phillipbarera/.nvm/versions/node/v10.16.3/lib/node_modules/react

Now run npm run dev in the aac-component library and npm run dev in your project and changes to the component library should be reflected in your project

Unlink things when done with dev

• running npm install on your project root will remove the symlink to aac-components
• cd aac-components/node_modules/react && npm unlink to unlink react from global npm symlinks
• Check your global symlinks to verify ls -al $(npm root -g)