diff options
author | 2022-08-20 00:26:22 +0200 | |
---|---|---|
committer | 2022-08-20 21:41:50 +0200 | |
commit | 8995ade5145036b283e39629a25faaa9679a880e (patch) | |
tree | b3ecfbbe63075c619bc4333a578cf9745de4b041 /subprojects/frontend/vite.config.ts | |
parent | fix(frontend): CodeMirror gutter accessibility (diff) | |
download | refinery-8995ade5145036b283e39629a25faaa9679a880e.tar.gz refinery-8995ade5145036b283e39629a25faaa9679a880e.tar.zst refinery-8995ade5145036b283e39629a25faaa9679a880e.zip |
refactor(frontend): inline CSS and minify HTML
Optimize first page loading time.
We only include variable and woff2 fonts, as they are widely supported.
Diffstat (limited to 'subprojects/frontend/vite.config.ts')
-rw-r--r-- | subprojects/frontend/vite.config.ts | 23 |
1 files changed, 22 insertions, 1 deletions
diff --git a/subprojects/frontend/vite.config.ts b/subprojects/frontend/vite.config.ts index bb421788..6ec2d513 100644 --- a/subprojects/frontend/vite.config.ts +++ b/subprojects/frontend/vite.config.ts | |||
@@ -4,7 +4,8 @@ import { fileURLToPath } from 'node:url'; | |||
4 | 4 | ||
5 | import { lezer } from '@lezer/generator/rollup'; | 5 | import { lezer } from '@lezer/generator/rollup'; |
6 | import react from '@vitejs/plugin-react'; | 6 | import react from '@vitejs/plugin-react'; |
7 | import { defineConfig } from 'vite'; | 7 | import { minify } from 'html-minifier-terser'; |
8 | import { defineConfig, PluginOption } from 'vite'; | ||
8 | import injectPreload from 'vite-plugin-inject-preload'; | 9 | import injectPreload from 'vite-plugin-inject-preload'; |
9 | import { VitePWA } from 'vite-plugin-pwa'; | 10 | import { VitePWA } from 'vite-plugin-pwa'; |
10 | 11 | ||
@@ -33,12 +34,32 @@ const { name: packageName, version: packageVersion } = JSON.parse( | |||
33 | process.env.VITE_PACKAGE_NAME ??= packageName; | 34 | process.env.VITE_PACKAGE_NAME ??= packageName; |
34 | process.env.VITE_PACKAGE_VERSION ??= packageVersion; | 35 | process.env.VITE_PACKAGE_VERSION ??= packageVersion; |
35 | 36 | ||
37 | const minifyPlugin: PluginOption = { | ||
38 | name: 'minify-html', | ||
39 | enforce: 'post', | ||
40 | async transformIndexHtml(html) { | ||
41 | if (isDevelopment) { | ||
42 | return html; | ||
43 | } | ||
44 | return minify(html, { | ||
45 | collapseWhitespace: true, | ||
46 | collapseBooleanAttributes: true, | ||
47 | minifyCSS: true, | ||
48 | removeComments: true, | ||
49 | removeAttributeQuotes: true, | ||
50 | removeRedundantAttributes: true, | ||
51 | sortAttributes: true, | ||
52 | }); | ||
53 | }, | ||
54 | }; | ||
55 | |||
36 | export default defineConfig({ | 56 | export default defineConfig({ |
37 | logLevel: 'info', | 57 | logLevel: 'info', |
38 | mode, | 58 | mode, |
39 | root: thisDir, | 59 | root: thisDir, |
40 | cacheDir: path.join(thisDir, 'build/vite/cache'), | 60 | cacheDir: path.join(thisDir, 'build/vite/cache'), |
41 | plugins: [ | 61 | plugins: [ |
62 | minifyPlugin, | ||
42 | react({ | 63 | react({ |
43 | babel: { | 64 | babel: { |
44 | // Gets rid of deoptimization warnings for large chunks. | 65 | // Gets rid of deoptimization warnings for large chunks. |