@helloinspire/melodic-react v2.5.7
Melodic for React
Link package for local development
- Link the melodic-react package locally
cd melodic-react && yarn link
- If working with melodic Components that use Hooks (stateful components), you'll have to link the version of React in your project to
melodic-react
. Explanation
yarn link ../<myapp>/node_modules/react
- Link the melodic-react package to the project you want to use your local melodic-react
cd <myapp> && yarn link @helloinspire/melodic-react
- When you make changes to melodic-react locally, run
yarn build
and the changes will be reflected in your project
** To reverse this process, simply use yarn unlink
or yarn unlink @helloinspire/melodic-react
Development scripts
yarn start
Run the component library locally to make changes
yarn deploy
Builds and deploys to Github pages hosted here
yarn push
Runs the build step, publishes the package to npm, and deploys to Github pages
yarn build
Compile library from Typescript to Javascript and output to the
/build
folder using Rollup
yarn test
Run Jest tests
yarn build-storybook
Builds the Storybook stories and outputs them to the
/.out
folder
Global Styles: StyledApp Component
By default the components come with minimal default styles. To get the fully fleshed out component as it was intended you will need to wrap the components with the StyledApp parent component to bring in a scoped version of melodic-web. We recommend placing this as the highest parent component in the host application, normally in App.tsx or related display layer.
<StyledApp className='inspire-app'>
<MainNav />
<ReactMelodicComponent { ...props } />
<Switch location={location}>
{routeComponents}
</Switch>
<MainFooter />
</StyledApp>
3 years ago
3 years ago
3 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago