Screenshot Generate For Each design & Some Enhancement :fire:
Generate a screenshot with puppeteer for every html file, so i edit a index.mjs and adds this:
Auto generate a screenshot for each html component and save the images in ./screenshot directory using puppeteer
The screenshots size for current files is 11MB when run the compress-images-with-sharp they be just 3MB
The screenshot images save with pattern ./screenshot/screenshot-<index>.png
For generate a index.html file run npm run build
This will first delete the old screenshot directory and will build the react-examples, and after he will run index.mjs to generate a new screenshot for every html design
add the images in a html file output, and improve some design architecture
Some others thing:
Create a ./style.css to add simple style sheet to the design
install compress-images-with-sharp because he in npm scripts but not installed :grey_question:
Also install puppeteer for handle screenshot generate
Add a project image to README.md file, i first chose a best and details screenshots in the app and make a zoom-out and take a picture, i saved the image in ./docs/screenshot.png and import it to readme file
this is my second contribute in this repo so i hope he accepted :+1:
Screenshot Generate For Each design & Some Enhancement :fire:
Generate a screenshot with
puppeteerfor every html file, so i edit aindex.mjsand adds this:./screenshotdirectory usingpuppeteer./screenshot/screenshot-<index>.pngindex.htmlfile runnpm run buildSome others thing:
./style.cssto add simple style sheet to the designcompress-images-with-sharpbecause he in npm scripts but not installed :grey_question:puppeteerfor handle screenshot generateREADME.mdfile, i first chose a best and details screenshots in the app and make a zoom-out and take a picture, i saved the image in./docs/screenshot.pngand import it to readme filethis is my second contribute in this repo so i hope he accepted :+1: