[code-infra] Ease playground creation #1322
Conversation
oliviertassinari
requested review from
atomiks and
michaldudak
as code owners
oliviertassinari
force-pushed
the
ease-playground-creation
branch
2 times, most recently
from
5e144c1 to
30ed724
Compare
oliviertassinari
force-pushed
the
ease-playground-creation
branch
from
30ed724 to
75842a8
Compare
| @@ -10,6 +10,7 @@ | |||
| "dev": "next dev --port 3005", | |||
| "deploy": "git push -f material-ui-docs master:latest", | |||
| "serve": "serve ./export -l 3010", | |||
| "create-playground": "cpy --cwd=scripts playground.template.tsx \"../../src/app/(private)/playground\" --rename=index.tsx", | |||
There was a problem hiding this comment.
I feel like it would be easier to just move playground.template.tsx to ../(private)/playground and manually duplicate/copy it when you want to make a new playground
In the Material UI repo I've used the playground script once (maybe twice?) and after that I just made new ones by duplicating something already tehre
There was a problem hiding this comment.
👍 I agree, I never used the script. The main problem I currently see with the playgrounds is how deeply nested they are in the directory tree.
There was a problem hiding this comment.
how deeply nested they are in the directory tree
Now that you mention this, what I've been doing a lot (manually in the terminal) is copying some demo in /(public) to the playground dir, and replacing the style import with import styles from '../../(public)/(content)/react/components/slider/demos/hero/css-modules/index.module.css'; (repeatedly from my clipboard history 😅)
Maybe you all are doing something similar as well? If so maybe a script could help, e.g. take the path to a demo and copy that demo to the playground, optionally rewrite the path to styles or copy the css file as well: pnpm create-playground slider/demos/hero (or menu/demos/checkbox-items etc)
There was a problem hiding this comment.
Yeah, I see how this could be useful. If it also opened the created playground in vscode, it would be nearly perfect :)
I initially tried https://github.com/mui/material-ui/blob/HEAD/CONTRIBUTING.md#trying-changes-on-the-playground but it didn't work. It then took me some time to figure out how to get a working playground.
Maybe this can help?
Off-topic. Tailwind CSS doesn't load on the playground. I believe we should configure it.