diff --git a/README.md b/README.md index 0b89ff3..daa3f9f 100644 --- a/README.md +++ b/README.md @@ -4,7 +4,7 @@ Compress all assets and embeds them into `dist/index.html`, making it convenient The recipient can open it directly in the browser without manually unzipping the file. -Adapted from [vite-plugin-singlefile](https://www.npmjs.com/package/vite-plugin-singlefile) +Using [DecompressionStream](https://developer.mozilla.org/docs/Web/API/DecompressionStream) + [base128-ascii](https://www.npmjs.com/package/base128-ascii). ## Setup @@ -12,13 +12,12 @@ Adapted from [vite-plugin-singlefile](https://www.npmjs.com/package/vite-plugin- npm i vite-plugin-singlefile-compression ``` -Then modify [vite.config.ts](test/vite.config.ts#L14) +Then modify `vite.config.ts`, see [test/vite.config.ts](test/vite.config.ts) ```ts // Import singleFileCompression import singleFileCompression from 'vite-plugin-singlefile-compression' -// https://vite.dev/config/ export default defineConfig({ plugins: [ vue(), @@ -26,26 +25,31 @@ export default defineConfig({ // Add singleFileCompression singleFileCompression(), ], + + // Not required options: esbuild: { - // Remove license comments + // Remove license comments, make file smaller. legalComments: "none" }, build: { terserOptions: { format: { - // Remove license comments + // Remove license comments, make file smaller. comments: false } }, + // Not use old syntax, make file smaller. target: 'esnext', + // Disable reporting compressed chunk sizes, slightly improve build speed. reportCompressedSize: false }, ``` -Then modify [src/router/index.ts](test/src/router/index.ts#L5) , change `createWebHistory` to `createWebHashHistory` +Then modify [src/router/index.ts](test/src/router/index.ts#L5) ```ts const router = createRouter({ + // Use Hash History history: createWebHashHistory(), ``` @@ -53,43 +57,43 @@ const router = createRouter({ ```ts export interface Options { - /** - * https://github.com/terser/html-minifier-terser?tab=readme-ov-file#options-quick-reference - * @default defaultHtmlMinifierTerserOptions - */ - htmlMinifierTerser?: htmlMinifierOptions | boolean; - - /** - * Try inline html used assets, if inlined or not used in JS. - * @default true - */ - tryInlineHtmlAssets?: boolean; - - /** - * Remove inlined asset files. - * @default true - */ - removeInlinedAssetFiles?: boolean; - - /** - * Try inline html icon, if icon is in public dir. - * @default true - */ - tryInlineHtmlPublicIcon?: boolean; - - /** - * Remove inlined html icon files. - * @default true - */ - removeInlinedPublicIconFiles?: boolean; - - /** - * Use Base128 to encode gzipped script. - * If false, use Base64. - * https://www.npmjs.com/package/base128-ascii - * @default true - */ - useBase128?: boolean + /** + * https://github.com/terser/html-minifier-terser?tab=readme-ov-file#options-quick-reference + * @default defaultHtmlMinifierTerserOptions + */ + htmlMinifierTerser?: htmlMinifierOptions | boolean; + + /** + * Try inline html used assets, if inlined or not used in JS. + * @default true + */ + tryInlineHtmlAssets?: boolean; + + /** + * Remove inlined asset files. + * @default true + */ + removeInlinedAssetFiles?: boolean; + + /** + * Try inline html icon, if icon is in public dir. + * @default true + */ + tryInlineHtmlPublicIcon?: boolean; + + /** + * Remove inlined html icon files. + * @default true + */ + removeInlinedPublicIconFiles?: boolean; + + /** + * Use Base128 to encode gzipped script. + * If false, use Base64. + * https://www.npmjs.com/package/base128-ascii + * @default true + */ + useBase128?: boolean; } ``` @@ -98,11 +102,11 @@ export interface Options { https://bddjr.github.io/vite-plugin-singlefile-compression/ ``` -vite v6.0.6 building for production... +vite v6.0.7 building for production... ✓ 45 modules transformed. rendering chunks (1)... -vite-plugin-singlefile-compression 1.2.4 building... +vite-plugin-singlefile-compression 1.2.5 building... file:///D:/bddjr/Desktop/code/js/vite-plugin-singlefile-compression/test/dist/index.html 101.02 KiB -> 46.52 KiB @@ -110,7 +114,7 @@ vite-plugin-singlefile-compression 1.2.4 building... Finish. dist/index.html 47.64 kB -✓ built in 690ms +✓ built in 716ms ``` ## Clone @@ -128,3 +132,5 @@ npm run build ## License [MIT](LICENSE.txt) + +Adapted from [vite-plugin-singlefile](https://www.npmjs.com/package/vite-plugin-singlefile). diff --git a/package-lock.json b/package-lock.json index a4e9561..1bca09a 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,17 +1,17 @@ { "name": "vite-plugin-singlefile-compression", - "version": "1.2.4", + "version": "1.2.5", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "vite-plugin-singlefile-compression", - "version": "1.2.4", + "version": "1.2.5", "license": "MIT", "dependencies": { "@types/html-minifier-terser": "^7.0.2", "@types/node": "^22.9.3", - "base128-ascii": "^2.0.1", + "base128-ascii": "^2.0.2", "esbuild": "^0.24.0", "html-minifier-terser": "^7.2.0", "mime": "^4.0.4", @@ -19,7 +19,7 @@ "picocolors": "^1.1.1", "rimraf": "^6.0.1", "typescript": "^5.7.2", - "vite": "^6.0.6" + "vite": "^6.0.7" } }, "node_modules/@esbuild/aix-ppc64": { @@ -808,14 +808,14 @@ "license": "MIT" }, "node_modules/base128-ascii": { - "version": "2.0.1", - "resolved": "https://registry.npmjs.org/base128-ascii/-/base128-ascii-2.0.1.tgz", - "integrity": "sha512-AKWPzBOPieqqw+W0TTd794HuFMJq6zE+5pJLAA7+Hp/klVDwxOcM7O/KaFeAX8/we97pIUJrjQfRp+lYt4Zakg==", + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/base128-ascii/-/base128-ascii-2.0.2.tgz", + "integrity": "sha512-ZMXMKz8GtFbvIGBRQbTzvy3O8ExGTc6N79T2dqRGERKQwGl9Xga1PBSL3VpD2Q3Im5jDWwrJjmiWoJfddpUpOw==", "license": "MIT", "dependencies": { "@types/node": "^22.10.5", "rimraf": "^6.0.1", - "typescript": "^5.7.2" + "typescript": "^5.7.3" } }, "node_modules/brace-expansion": { @@ -1507,9 +1507,9 @@ "license": "0BSD" }, "node_modules/typescript": { - "version": "5.7.2", - "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.7.2.tgz", - "integrity": "sha512-i5t66RHxDvVN40HfDd1PsEThGNnlMCMT3jMUuoh9/0TaqWevNontacunWyN02LA9/fIbEWlcHZcgTKb9QoaLfg==", + "version": "5.7.3", + "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.7.3.tgz", + "integrity": "sha512-84MVSjMEHP+FQRPy3pX9sTVV/INIex71s9TL2Gm5FG/WG1SqXeKyZ0k7/blY/4FdOzI12CBy1vGc4og/eus0fw==", "license": "Apache-2.0", "bin": { "tsc": "bin/tsc", @@ -1526,9 +1526,9 @@ "license": "MIT" }, "node_modules/vite": { - "version": "6.0.6", - "resolved": "https://registry.npmjs.org/vite/-/vite-6.0.6.tgz", - "integrity": "sha512-NSjmUuckPmDU18bHz7QZ+bTYhRR0iA72cs2QAxCqDpafJ0S6qetco0LB3WW2OxlMHS0JmAv+yZ/R3uPmMyGTjQ==", + "version": "6.0.7", + "resolved": "https://registry.npmjs.org/vite/-/vite-6.0.7.tgz", + "integrity": "sha512-RDt8r/7qx9940f8FcOIAH9PTViRrghKaK2K1jY3RaAURrEUbm9Du1mJ72G+jlhtG3WwodnfzY8ORQZbBavZEAQ==", "license": "MIT", "dependencies": { "esbuild": "^0.24.2", diff --git a/package.json b/package.json index 5154de0..f04bcb4 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "vite-plugin-singlefile-compression", - "version": "1.2.4", + "version": "1.2.5", "main": "dist/index.js", "typings": "dist/index.d.ts", "files": [ @@ -42,7 +42,7 @@ "dependencies": { "@types/html-minifier-terser": "^7.0.2", "@types/node": "^22.9.3", - "base128-ascii": "^2.0.1", + "base128-ascii": "^2.0.2", "esbuild": "^0.24.0", "html-minifier-terser": "^7.2.0", "mime": "^4.0.4", @@ -50,6 +50,6 @@ "picocolors": "^1.1.1", "rimraf": "^6.0.1", "typescript": "^5.7.2", - "vite": "^6.0.6" + "vite": "^6.0.7" } } diff --git a/src/index.ts b/src/index.ts index 36289ce..37a176b 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,5 +1,5 @@ import { UserConfig, PluginOption, ResolvedBuildOptions, ResolvedConfig } from "vite" -import { OutputChunk, OutputAsset, OutputBundle } from "rollup" +import { OutputChunk, OutputAsset, OutputBundle, RollupOptions } from "rollup" import mime from 'mime' import pc from "picocolors" import svgToTinyDataUri from "mini-svg-data-uri" @@ -151,19 +151,22 @@ function KiB(size: number) { function setConfig(config: UserConfig) { config.base = './' - if (!config.build) - config.build = {} - + config.build ??= {} config.build.assetsInlineLimit = () => true config.build.chunkSizeWarningLimit = Infinity config.build.cssCodeSplit = false config.build.assetsDir = 'assets' config.build.modulePreload = { polyfill: false } - if (!config.build.rollupOptions) - config.build.rollupOptions = {} - - config.build.rollupOptions.output = { inlineDynamicImports: true } + config.build.rollupOptions ??= {} + config.build.rollupOptions.output ??= {} + if (Array.isArray(config.build.rollupOptions.output)) { + for (const output of config.build.rollupOptions.output) { + output.inlineDynamicImports = true + } + } else { + config.build.rollupOptions.output.inlineDynamicImports = true + } } async function generateBundle(bundle: OutputBundle, config: ResolvedConfig, options: innerOptions) { @@ -174,9 +177,7 @@ async function generateBundle(bundle: OutputBundle, config: ResolvedConfig, opti if (config.build.assetsDir !== 'assets') return console.error("error: config.build.assetsDir has been changed!") - const distURL = (u => - u.endsWith('/') ? u : u + '/' - )(pathToFileURL(path.resolve(config.build.outDir)).href) + const distURL = pathToFileURL(path.resolve(config.build.outDir)).href + '/' const globalDelete = new Set() const globalDoNotDelete = new Set() @@ -212,7 +213,9 @@ async function generateBundle(bundle: OutputBundle, config: ResolvedConfig, opti // Fix async import const newJSCode = ["self.__VITE_PRELOAD__=void 0"] - newJSCode.toString = () => newJSCode.join(';') + newJSCode.toString = function () { + return this.join(';') + } // remove html comments newHtml = newHtml.replaceAll(//g, '') diff --git a/test/src/router/index.ts b/test/src/router/index.ts index b9c2045..90c5d9f 100644 --- a/test/src/router/index.ts +++ b/test/src/router/index.ts @@ -2,6 +2,7 @@ import { createRouter, createWebHashHistory } from 'vue-router' import HomeView from '../views/HomeView.vue' const router = createRouter({ + // Use Hash History history: createWebHashHistory(), routes: [ { diff --git a/test/vite.config.ts b/test/vite.config.ts index 042858a..979990b 100644 --- a/test/vite.config.ts +++ b/test/vite.config.ts @@ -16,17 +16,19 @@ export default defineConfig({ singleFileCompression(), ], esbuild: { - // Remove license comments + // Remove license comments, make file smaller. legalComments: "none" }, build: { terserOptions: { format: { - // Remove license comments + // Remove license comments, make file smaller. comments: false } }, + // Not use old syntax, make file smaller. target: 'esnext', + // Disable reporting compressed chunk sizes, slightly improve build speed. reportCompressedSize: false }, resolve: {