@greendrake/vite-preset 0.2.0 → 0.4.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;
@@ -50,7 +49,7 @@ What the preset sets:
   vueSpa({ dirname: import.meta.dirname, sourcePackages: ['@greendrake/', '@acme/ui', 'my-design-system'] })
   ```
 
-  Excluding a package also hides it from Vite's dependency scanner, which externalises every excluded id and so never reads what that package imports. The third-party packages behind a source package are therefore pinned into the pre-bundle too, or the first browser request for one is a discovery: Vite re-runs the optimiser mid-session and full-reloads every open page — which under a parallel E2E run lands in the middle of tests in flight. The preset walks the app's runtime dependencies, follows the source packages among them, and pins each package they depend on, plus each peer they declare that the app itself supplies at runtime. Each is named in Vite's `parent > child` form unless the app declares it too, in which case its plain name — the id the scanner itself would produce — is used instead. Two things are left out: a package published only under subpaths, which no `optimizeDeps` entry can name and which Vite reaches through the subpath ids that import it anyway; and anything behind a source package the app keeps among its dev dependencies, which by the app's own reckoning is tooling (a build-tool integration shipped beside a package's components, a native-build helper) that browser code never reaches. That split is what an app is asserting when it puts a package in one list rather than the other, so put build-time source packages in `devDependencies`.
+  Excluding a package also hides it from Vite's dependency scanner, which externalises every excluded id and so never reads what that package imports. The third-party packages behind a source package are therefore pinned into the pre-bundle too, or the first browser request for one is a discovery: Vite re-runs the optimiser mid-session and full-reloads every open page — which under a parallel E2E run lands in the middle of tests in flight. The preset walks the app's runtime dependencies, follows the source packages among them, and pins each package they depend on, plus each peer they declare that the app itself supplies at runtime. Each is named in Vite's `parent > child` form unless the app declares it too, in which case its plain name — the id the scanner itself would produce — is used instead. Three things are left out: a package published only under subpaths, which no `optimizeDeps` entry can name and which Vite reaches through the subpath ids that import it anyway; a peer that is itself a source package, which the app's own declaration of it puts under the same rules as any other source package — excluded, and walked in its turn; and anything behind a source package the app keeps among its dev dependencies, which by the app's own reckoning is tooling (a build-tool integration shipped beside a package's components, a native-build helper) that browser code never reaches. That split is what an app is asserting when it puts a package in one list rather than the other, so put build-time source packages in `devDependencies`.
 
 - `build`: font files (`woff2`, `woff`, `eot`, `ttf`, `otf`) are emitted unhashed under `assets/fonts/`, so `index.html` can prefetch them by a stable name; everything else is hashed.
 
@@ -75,7 +74,7 @@ An HMR update whose accepted module sits inside an import cycle cannot be re-exe
 import { loadAppEnv, requirePort, envBool, deriveImageBaseUrl, apiTargetEnv, buildHash } from '@greendrake/vite-preset'
 ```
 
-- `loadAppEnv(mode, dirname)` — the app's `.env` / `.env.<mode>` files, every key (not only `VITE_`-prefixed ones): they carry plain build inputs, and the `export` prefix they may be written with is stripped so the same file can be shell-sourced. `process.env` outranks the file. Do not name the files `.env.development` / `.env.production`: bun auto-loads those into `process.env` at startup, and whichever one it picked would then outrank the mode's file. `@greendrake/dash/vite` builds its dashboard convention on this.
+- `loadAppEnv(mode, dirname)` — the app's `.env` / `.env.<mode>` files, every key (not only `VITE_`-prefixed ones): they carry plain build inputs, and the `export` prefix they may be written with is stripped so the same file can be shell-sourced. `process.env` outranks the file. Do not name the files `.env.development` / `.env.production`: bun auto-loads those into `process.env` at startup, and whichever one it picked would then outrank the mode's file.
 - `requirePort()` — `VITE_PORT`, required; the single port convention.
 - `envBool(value)` — `"1"`, `"t"`, `"true"` (any case) are true; `"0"`, `"false"`, unset and everything else are false. `Boolean(process.env.X)` would take the literal string `"0"` as true.
 - `deriveImageBaseUrl(env = process.env)` — the prefix for object-storage image URLs. A defined `S3_PREFIX` wins outright, even when empty; otherwise `AWS_S3_ENDPOINT/AWS_S3_BUCKET`; otherwise `''`.
@@ -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.
@@ -112,12 +107,12 @@ The single source of truth for where the API lives, pure and environment-free, s
 
 ## Sass: import shared style packages by bare specifier
 
-`@use '@greendrake/font-inter'` — never `@use 'pkg:@greendrake/font-inter'`, and do not register Sass's `NodePackageImporter`.
+`@use '@acme/font'` — never `@use 'pkg:@acme/font'`, and do not register Sass's `NodePackageImporter`.
 
 Vite resolves bare specifiers with its own Sass importer and rebases relative `url()` references inside the imported package against that package's own source location, so `@font-face { src: url('./fonts/X.woff2') }` in a font package resolves, gets emitted into `dist/assets/`, and the emitted CSS points at the built asset.
 
 `NodePackageImporter` resolves the same `@use` to a path Vite's CSS pipeline does not rebase against. The `url()` then survives verbatim into the output, no font asset is emitted, and the build warns `didn't resolve at build time, it will remain unchanged to be resolved at runtime` — every font 404s at runtime. This is a property of the importer, not of any Vite version.
 
-The corollary, enforced by `@greendrake/scss-kit`'s `_font-face.scss`: the `url()` literal must be written in the owning package's own `.scss`, because that is the file the rebasing is relative to.
+The corollary: the `url()` literal must be written in the owning package's own `.scss`, because that is the file the rebasing is relative to — a shared `@font-face` mixin that builds the URL itself breaks it.
 
 If a future Vite drops bare-specifier support, migrate to `loadPaths` or move the `@font-face` blocks into the consuming apps — not to `pkg:`.

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@greendrake/vite-preset",
-    "version": "0.2.0",
+    "version": "0.4.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.2.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.2.0",
+        "@greendrake/dev-config": "0.4.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/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 —
@@ -19,23 +18,3 @@ export const htmlPlaceholders = (map: Record<string, string>): Plugin => {
         }
     }
 }
-
-// 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

@@ -4,15 +4,15 @@ import vue from '@vitejs/plugin-vue'
 import { mergeConfig, type ConfigEnv, type UserConfig, type UserConfigFnObject } from 'vite'
 
 export { envBool, deriveImageBaseUrl, loadAppEnv, requirePort, apiTargetEnv, buildHash } from './env'
-// Re-exported so config factories building on vueSpa (e.g.
-// @greendrake/dash/vite) speak this package's vite types: a second vite
-// copy resolved downstream is a structurally unrelated set of the same names.
+// Re-exported so config factories building on vueSpa 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'
@@ -28,14 +28,12 @@ export interface VueSpaOptions {
     scssLoadPaths?: string[]
     // 'env' (default): the strict VITE_PORT convention, required when the dev
     // server starts. A number: that port verbatim, for callers that resolved
-    // the app's env themselves (see @greendrake/dash/vite). false: no
-    // port pinning — for simple apps served on any free port.
+    // the app's env themselves. false: no port pinning — for simple apps
+    // served on any free port.
     port?: 'env' | number | false
     // 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
@@ -90,7 +88,7 @@ export const vueSpa =
         const portPin = command === 'serve' && options.port !== false ? { port: typeof options.port === 'number' ? options.port : requirePort(), strictPort: true } : undefined
         const base: UserConfig = {
             ...(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)] : []), ...(options.htmlMinify ? [htmlMinify()] : [])],
+            plugins: [vue(), hmrCircularImportGuard(), ...(options.staticRoots?.length ? [staticRootsPlugin(options.staticRoots)] : []), ...(options.htmlPlaceholders ? [htmlPlaceholders(options.htmlPlaceholders)] : [])],
             ...(command === 'serve'
                 ? {
                       server: {

package/src/sourceDeps.ts

@@ -86,9 +86,10 @@ export const nestedDependencies = (dirname: string, declared: DeclaredDependenci
         }
         // A peer is the app's to supply, so it counts only where the app does,
         // at runtime — the same reckoning, applied to what a package leaves to
-        // its consumer.
+        // its consumer. A source package among them is served raw like any
+        // other, and walked as the app's own declaration of it is.
         for (const peer of Object.keys(pkg.peerDependencies ?? {})) {
-            if (declared.runtime.includes(peer)) pin(here, dirname, peer)
+            if (declared.runtime.includes(peer) && !isSourcePackage(peer)) pin(here, dirname, peer)
         }
     }
     for (const name of declared.runtime) {