joshwcomeau/react-retro-hit-counter

Improve build process for working with demo

Aperta

#4 aperta il 28 gen 2018

 (0 commenti) (0 reazioni) (0 assegnatari)JavaScript (5 fork)github user discovery
enhancementhelp wanted

Metriche repository

Star
 (165 stelle)
Metriche merge PR
 (Nessuna PR mergiata in 30 g)

Descrizione

When working on this component, you can either use the React Storybook stories, or the demo.

The demo is a much nicer dev experience, since you have full access to all the props. However, the demo is its own project, nested within the parent project, and the dependency is a little weird.

The demo installs react-retro-hit-counter from NPM. Then, when building the parent project (the component itself), a separate script copies the dist files into the demo's node_modules directory:

"scripts": {
    "build": "rollup -c && npm run copy-to-demo",
    "copy-to-demo": "rm -rf ./demo/node_modules/react-retro-hit-counter/dist && cp -r ./dist ./demo/node_modules/react-retro-hit-counter/dist",

This is not the "right" way to do this. The only other way that I've seen is to use npm link to create a symlink between the project's dist directory and your global NPM installs, and then another from that global file to the child project's node_modules directory.

When I tried this, though, the demo wasn't rebuilding whenever the files changed. This means I'd have to build the component, wait 3 seconds, make some sort of trivial change to the demo, and wait for the demo to auto-rebuild.

My current solution takes about 3 seconds, and the demo auto-rebuilds. So really, it's not bad... but I feel like there has to be a better way?

Guida contributor