admin/vite-build

[tohuynh]

Link to Relevant Issue

WIP #134

Description of Changes

Build the app and lib using vitejs

npm commands for the app

• npm run start:app launches the app locally
• npm run build:app builds the app in production mode. Generates static site in the build dir. See an example build dir and example deployment.
• npm run deploy:app deploys build dir (the example app) to forked repo's gh-pages
• npm run preview:app launches the app locally, but in production mode at localhost:5000/cdp-frontend

build lib

npm run build:lib builds cdp-frontend as a library to be consumed by various CDP instances by following these recommendations. It generates a dist dir with 3 files: index.es.js, index.umd.js, and index.css (the assets are inline in the minified CSS file)

misc changes

• Removed webpack and related dev dependencies. I had to perform a fresh npm i to make it work.
• @BrianL3 I had to change the use of the default cover images a little bit so that they can be imported dynamically in order for them to be included in the final build.

[BrianL3]

My only comment is that you should maybe update the README/CONTRIBUTION to make sure people know that npm run start:app and npm run build:app are the ways to get the app up and running. I would like Nick McGruder and other devs new to the project to have a seamless experience getting the app up and running.

[tohuynh]

My only comment is that you should maybe update the README/CONTRIBUTION to make sure people know that npm run start:app and npm run build:app are the ways to get the app up and running. I would like Nick McGruder and other devs new to the project to have a seamless experience getting the app up and running.

Good point

[tohuynh]

Added some documentation for new npm commands to contributing.md

Added another command npm run deploy:app which deploys the example app to your forked repo's gh-pages. Devs can choose to deploy the storybook site or the example app, when making a PR.

[hawkticehurst]

Beyond a question about Storybook still working everything looks great!

[evamaxfield]

Looks good to me! Can someone give me the high level overview of what are the benefits of switching?

[tohuynh]

Looks good to me! Can someone give me the high level overview of what are the benefits of switching?

• Build app and lib with the same frontend tooling
• build:app is now a part GitHub CI
• Faster dev server with hot module reload (with cdp icons rendering, snowpack wasn't working before)
• why Vite?
• some build optimization

[evamaxfield]

Beautiful. Thank you.