Add loaders, rules, and plugins to dashboard

[codenickycode]

• [ ] react refresh plugin
• [ ] mini css extract loader
• [ ] style loader
• [x] font rule
• [ ] image rule
• [x] svg rule
• [ ] swc loader
• [x] dot env plugin
• [ ] css loader
  • camelCase
• [ ] postcss-loader
  • autoprefixer

[codenickycode]

Code splitting:

DOM widget renders an async component using React.lazy. Asserts component loaded correctly. Script imports dynamic chunk, asserts import succeeded Validate prod/dev builds:

Script checks process.env.NODE_ENV value Script compares build output file sizes Unused CSS:

Script parses CSS bundles, asserts usage of each class/selector DOM widget imports CSS, asserts measured styles after rendering Environment vars:

Script asserts env vars replaced, e.g. process.env.API_KEY is defined Tree shaking:

Script imports known unused code, asserts it's not included DOM widget imports large utility library, checks bundle size Content hashing:

Script fetches all asset files, checks hashes look correct TypeScript types:

Script checks all tsconfig types are generated DOM widgets tests importing .d.ts files JSDoc comments:

Script parses output bundle, asserts JSDoc comments exist