STOKR - Components Library
Components that use routing (e.g. LearnMore, MainMenu, AuthProvider, HeaderHo, StepsProgress, RegisterTaxId) must be rendered inside a React Router. Wrap your app with a Router from react-router-dom:
``jsx
import { BrowserRouter } from 'react-router-dom'
import App from './App'
root.render(
)
`
Install the peer dependency if needed: npm install react-router-dom
If you see "Invalid hook call" or "Cannot read properties of null (reading 'useContext')" when using this library, the app and the library must use the same React instance. Do this in your app:
1. Install peer dependencies (if not already):
npm install react react-dom styled-components
2. Vite apps – add dedupe in vite.config.js / vite.config.ts:`
js`
export default defineConfig({
resolve: {
dedupe: ['react', 'react-dom', 'styled-components'],
},
// ...rest of config
})
3. Rebuild / reinstall the library after pulling the latest version (e.g. npm run build:dist in the library, then in your app reinstall or refresh the dependency).
---
"build": "cross-env BABEL_ENV=production babel src -d dist",
Story Source for showing code consumption examples
Viewport for allowing us to test different screen sizes and devices
https://medium.com/better-programming/how-to-publish-a-react-component-library-c89a07566770
1. Commit your changes.
2. Update CHANGELOG.md – add a new # vX.Y.Z section at the top (below the intro) with a short list of changes for this version.npm version
3. Bump the version: (e.g. npm version 1.2.0 or npm version 3.0.0-alpha.1).npm run build:dist
4. Run to build the dist folder for npm.dist/
5. If you added new images, copy them to the same path under .npm publish` (you must be authenticated to publish to npm).
6. Publish:
Consumers can see what changed in each release in CHANGELOG.md.