@greendrake/vite-preset 0.1.0 → 0.3.0

package/README.md

@@ -34,13 +34,12 @@ export default defineConfig(
 | `scssLoadPaths` | Extra `@use` resolution roots for Sass (e.g. the app's `src/scss`). |
 | `port` | `'env'` (default): `VITE_PORT` is required whenever a server starts. A number pins that port. `false` disables pinning, for an app served on any free port. |
 | `htmlPlaceholders` | Literal substitutions applied to `index.html` before Vite processes it (see `htmlPlaceholders` below). |
-| `htmlMinify` | Minify `index.html`, inline scripts and styles included, in production builds. |
 | `staticRoots` | Directories outside the app served at public URL prefixes (see `staticRoots` below). |
 | `overrides` | A `UserConfig` deep-merged last — the escape hatch for `server.proxy`, extra plugins, build tweaks. |
 
 What the preset sets:
 
-- plugins: `@vitejs/plugin-vue` and the HMR circular-import guard, plus the `staticRoots`, `htmlPlaceholders` and `htmlMinify` plugins when their options are given;
+- plugins: `@vitejs/plugin-vue` and the HMR circular-import guard, plus the `staticRoots` and `htmlPlaceholders` plugins when their options are given;
 - `server.port`/`preview.port` from `VITE_PORT` with `strictPort`, for `vite dev` and `vite preview` only — builds run in deploy contexts that never define a dev port;
 - `server.fs.allow`: the parent of the app root (a workspace), and every static root's directory;
 - `resolve.alias`: `@` → `<dirname>/src`; `resolve.dedupe`: `vue`, `pinia`, `vue-router` — each must also be a direct dependency of the app, or Vite fails to resolve it;
@@ -88,10 +87,6 @@ import { loadAppEnv, requirePort, envBool, deriveImageBaseUrl, apiTargetEnv, bui
 
 Substitutes build-time values into `index.html` before Vite processes it — a generated inline script, a build hash, PWA metadata. Keys are matched literally (convention: `__NAME__`); an empty map is an error. `vueSpa`'s `htmlPlaceholders` option installs it.
 
-### `htmlMinify()`
-
-Production-only: collapses whitespace, strips comments, minifies inline JS and CSS in `index.html`. Dev keeps the source readable. Installed by the `htmlMinify` option.
-
 ### `staticRoots(roots)` and `staticRootFiles(root)`
 
 Some assets belong to the product rather than to the frontend — a locale catalogue a backend renders from too, prose a content page shows. A `StaticRoot` is `{ dir, urlPath, transform? }`: an absolute directory, the URL prefix it appears under (e.g. `/i18n`), and an optional per-file rewrite applied on the way out. The plugin serves the root by middleware in dev and copies it into `dist/` at build, so the two modes publish the same bytes; `.yaml`/`.yml` and `.json` get their content types, anything else is `text/plain`. Requests cannot climb out of the root. `staticRootFiles(root)` lists what a root publishes as URL paths, for a service worker's precache list. Installed by the `staticRoots` option.

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@greendrake/vite-preset",
-    "version": "0.1.0",
+    "version": "0.3.0",
     "description": "Vite config factory and build-env helpers for Vue 3 single-page apps: plugin set, strict dev port, alias, dedupe and source-package pre-bundling rules",
     "license": "MIT",
     "author": "Eugene Greendrake <eugene@greendrake.nz>",
@@ -38,17 +38,14 @@
     },
     "prettier": "@greendrake/dev-config/prettier",
     "dependencies": {
-        "@greendrake/util": "0.1.0",
-        "@vitejs/plugin-vue": "^6.0.7",
-        "html-minifier-terser": "^7.2.0"
+        "@vitejs/plugin-vue": "^6.0.7"
     },
     "peerDependencies": {
         "vite": ">=8"
     },
     "devDependencies": {
-        "@greendrake/dev-config": "0.1.0",
+        "@greendrake/dev-config": "0.3.0",
         "@types/bun": "^1.3.5",
-        "@types/html-minifier-terser": "^7.0.2",
         "@types/node": "^24.0.0",
         "typescript": "6.0.3",
         "vite": "^8.2.1"

package/src/apiTarget.ts

@@ -17,9 +17,11 @@
 export interface ApiTargetEnv {
     // True under `vite dev` (command === 'serve'); false in production builds.
     dev: boolean
-    apiPort?: string
-    publicFeHost?: string
-    publicApiHost?: string
+    // Undefined as readily as absent: each is an environment variable, which
+    // is either set or not.
+    apiPort?: string | undefined
+    publicFeHost?: string | undefined
+    publicApiHost?: string | undefined
     // Endpoint paths appended to the resolved origin (defaults /v1/api and
     // /v1/ws). A backend that routes POST at the host root sets apiPath: ''.
     apiPath?: string

package/src/html.ts

@@ -1,4 +1,3 @@
-import { minify } from 'html-minifier-terser'
 import type { Plugin } from 'vite'
 
 // Substitutes build-time values into index.html before Vite processes it —
@@ -14,27 +13,8 @@ export const htmlPlaceholders = (map: Record<string, string>): Plugin => {
         name: 'greendrake-html-placeholders',
         transformIndexHtml: {
             order: 'pre',
-            handler: html => html.replace(pattern, match => map[match])
+            // The pattern is built from the map's own keys, so every match is one.
+            handler: html => html.replace(pattern, match => map[match]!)
         }
     }
 }
-
-// Production-only HTML minification — strips comments and collapses
-// whitespace in index.html, and runs inline scripts/styles through
-// terser/CSS minification. Dev keeps the source readable.
-export const htmlMinify = (): Plugin => ({
-    name: 'greendrake-html-minify',
-    apply: 'build',
-    transformIndexHtml: {
-        order: 'post',
-        handler: html =>
-            minify(html, {
-                collapseWhitespace: true,
-                removeComments: true,
-                minifyJS: true,
-                minifyCSS: true,
-                useShortDoctype: true,
-                removeRedundantAttributes: true
-            })
-    }
-})

package/src/main.ts

@@ -8,11 +8,11 @@ export { envBool, deriveImageBaseUrl, loadAppEnv, requirePort, apiTargetEnv, bui
 // @greendrake/dash/vite) speak this package's vite types: a second vite
 // copy resolved downstream is a structurally unrelated set of the same names.
 export type { ConfigEnv, UserConfig, UserConfigFnObject } from 'vite'
-export { htmlPlaceholders, htmlMinify } from './html'
+export { htmlPlaceholders } from './html'
 export { resolveApiTarget, browserRuntime, type ApiTarget, type ApiTargetEnv, type ApiTargetRuntime } from './apiTarget'
 export { staticRoots, staticRootFiles, type StaticRoot } from './staticRoots'
 import { requirePort } from './env'
-import { htmlPlaceholders, htmlMinify } from './html'
+import { htmlPlaceholders } from './html'
 import { hmrCircularImportGuard } from './hmr'
 import { nestedDependencies, type DeclaredDependencies } from './sourceDeps'
 import { staticRoots as staticRootsPlugin, type StaticRoot } from './staticRoots'
@@ -23,7 +23,7 @@ export interface VueSpaOptions {
     // Compile-time globals; values are serialized automatically (strings become
     // string literals, booleans become true/false, objects become object
     // literals — e.g. the ApiTargetEnv carried by __API_TARGET_ENV__).
-    define?: Record<string, string | number | boolean | object | null | undefined>
+    define?: Record<string, string | number | boolean | object | null | undefined> | undefined
     // Extra scss @use resolution roots (e.g. the app's src/scss).
     scssLoadPaths?: string[]
     // 'env' (default): the strict VITE_PORT convention, required when the dev
@@ -34,8 +34,6 @@ export interface VueSpaOptions {
     // Build-time placeholder substitution in index.html (see the
     // htmlPlaceholders plugin) — e.g. injecting an inline bootstrap script.
     htmlPlaceholders?: Record<string, string>
-    // Minify index.html (incl. inline JS/CSS) in production builds.
-    htmlMinify?: boolean
     // Directories outside the app served at a public URL prefix — product
     // assets both stacks own (locale catalogues, content prose). Served by
     // middleware in dev and copied into dist/ at build, so the two modes
@@ -48,10 +46,10 @@ export interface VueSpaOptions {
     // source-shipped by construction — an app with source packages of its own
     // names them here, and must name the @greendrake scope again if it uses
     // any.
-    sourcePackages?: string[]
+    sourcePackages?: string[] | undefined
     // Deep-merged last over the preset — the escape hatch for anything
     // app-specific (server.proxy, extra plugins, build tweaks).
-    overrides?: UserConfig
+    overrides?: UserConfig | undefined
 }
 
 // The libraries the app and every component package it renders must share one
@@ -89,11 +87,11 @@ export const vueSpa =
         // none (and never serves) must not be made to produce one.
         const portPin = command === 'serve' && options.port !== false ? { port: typeof options.port === 'number' ? options.port : requirePort(), strictPort: true } : undefined
         const base: UserConfig = {
-            define: options.define && Object.fromEntries(Object.entries(options.define).map(([key, value]) => [key, JSON.stringify(value)])),
-            plugins: [vue(), hmrCircularImportGuard(), ...(options.staticRoots?.length ? [staticRootsPlugin(options.staticRoots)] : []), ...(options.htmlPlaceholders ? [htmlPlaceholders(options.htmlPlaceholders)] : []), ...(options.htmlMinify ? [htmlMinify()] : [])],
-            server:
-                command === 'serve'
-                    ? {
+            ...(options.define && { define: Object.fromEntries(Object.entries(options.define).map(([key, value]) => [key, JSON.stringify(value)])) }),
+            plugins: [vue(), hmrCircularImportGuard(), ...(options.staticRoots?.length ? [staticRootsPlugin(options.staticRoots)] : []), ...(options.htmlPlaceholders ? [htmlPlaceholders(options.htmlPlaceholders)] : [])],
+            ...(command === 'serve'
+                ? {
+                      server: {
                           ...portPin,
                           // '..' reaches the workspace an app sits directly
                           // inside. Anything the dev server must read from
@@ -104,10 +102,11 @@ export const vueSpa =
                           // refused.
                           fs: { allow: ['..', ...(options.staticRoots ?? []).map(root => root.dir)] }
                       }
-                    : undefined,
+                  }
+                : {}),
             // vite preview also loads with command 'serve'; pin it to the same
             // port convention so E2E runs are deterministic.
-            preview: portPin,
+            ...(portPin && { preview: portPin }),
             resolve: {
                 alias: { '@': path.resolve(options.dirname, './src') },
                 dedupe: FRAMEWORK
@@ -131,13 +130,13 @@ export const vueSpa =
                 exclude: allDeps.filter(isSourcePackage),
                 include: [...new Set([...FRAMEWORK.filter(name => allDeps.includes(name)), ...nestedDependencies(options.dirname, deps, isSourcePackage)])]
             },
-            css: options.scssLoadPaths
-                ? {
-                      preprocessorOptions: {
-                          scss: { loadPaths: options.scssLoadPaths }
-                      }
-                  }
-                : undefined,
+            ...(options.scssLoadPaths && {
+                css: {
+                    preprocessorOptions: {
+                        scss: { loadPaths: options.scssLoadPaths }
+                    }
+                }
+            }),
             build: {
                 rolldownOptions: {
                     output: {

package/src/sourceDeps.ts

@@ -1,4 +1,4 @@
-import { existsSync, readFileSync } from 'node:fs'
+import { existsSync, readFileSync, realpathSync } from 'node:fs'
 import path from 'node:path'
 
 // The parts of a package.json this walk reads.
@@ -16,11 +16,14 @@ export interface DeclaredDependencies {
 }
 
 // Where the installer put a package: the nearest node_modules at or above
-// `from` holding it.
+// `from` holding it, as the real path behind whatever link reached it. That is
+// where its own dependencies are found from — an isolated install (bun's, pnpm's)
+// puts them beside the package's real directory, not beside the link an app's
+// node_modules holds — and it is what Node and Vite resolve from too.
 const packageDir = (from: string, name: string): string => {
     for (let dir = from; ; dir = path.dirname(dir)) {
         const candidate = path.join(dir, 'node_modules', name)
-        if (existsSync(path.join(candidate, 'package.json'))) return candidate
+        if (existsSync(path.join(candidate, 'package.json'))) return realpathSync(candidate)
         if (path.dirname(dir) === dir) throw new Error(`${name} is declared but not installed anywhere above ${from}`)
     }
 }

package/src/staticRoots.ts

@@ -42,7 +42,7 @@ export const staticRoots = (roots: StaticRoot[]): Plugin => ({
 
     configureServer(server) {
         server.middlewares.use((req, res, next) => {
-            const url = (req.url ?? '').split('?')[0]
+            const url = (req.url ?? '').replace(/\?.*/, '')
             const root = roots.find(r => url.startsWith(`${r.urlPath}/`))
             if (!root) {
                 next()