Upgrade to Vite 4.2 (#6759)

withastro · Apr 5, 2023 · 7116c02 · 7116c02
1 parent aad853a
commit 7116c02
Show file tree

Hide file tree

Showing 15 changed files with 331 additions and 86 deletions.
diff --git a/.changeset/unlucky-wolves-share.md b/.changeset/unlucky-wolves-share.md
@@ -0,0 +1,5 @@
+---
+'astro': patch
+---
+
+Upgrade to Vite 4.2
diff --git a/packages/astro/package.json b/packages/astro/package.json
@@ -155,7 +155,7 @@
     "typescript": "*",
     "unist-util-visit": "^4.1.0",
     "vfile": "^5.3.2",
-    "vite": "^4.1.2",
+    "vite": "^4.2.1",
     "vitefu": "^0.2.4",
     "yargs-parser": "^21.0.1",
     "zod": "^3.17.3"

diff --git a/packages/astro/src/core/build/add-rollup-input.ts b/packages/astro/src/core/build/add-rollup-input.ts
@@ -1,4 +1,4 @@
-import type { InputOptions } from 'rollup';
+import type { Rollup } from 'vite';
 
 function fromEntries<V>(entries: [string, V][]) {
 	const obj: Record<string, V> = {};
@@ -8,7 +8,10 @@ function fromEntries<V>(entries: [string, V][]) {
 	return obj;
 }
 
-export function addRollupInput(inputOptions: InputOptions, newInputs: string[]): InputOptions {
+export function addRollupInput(
+	inputOptions: Rollup.InputOptions,
+	newInputs: string[]
+): Rollup.InputOptions {
 	// Add input module ids to existing input option, whether it's a string, array or object
 	// this way you can use multiple html plugins all adding their own inputs
 	if (!inputOptions.input) {

diff --git a/packages/astro/src/core/build/internal.ts b/packages/astro/src/core/build/internal.ts
@@ -1,4 +1,4 @@
-import type { OutputChunk, RenderedChunk } from 'rollup';
+import type { Rollup } from 'vite';
 import type { PageBuildData, ViteID } from './types';
 
 import type { SSRResult } from '../../@types/astro';
@@ -76,7 +76,7 @@ export interface BuildInternals {
 	// A list of all static files created during the build. Used for SSR.
 	staticFiles: Set<string>;
 	// The SSR entry chunk. Kept in internals to share between ssr/client build steps
-	ssrEntryChunk?: OutputChunk;
+	ssrEntryChunk?: Rollup.OutputChunk;
 	componentMetadata: SSRResult['componentMetadata'];
 }
 
@@ -146,7 +146,7 @@ export function trackClientOnlyPageDatas(
 
 export function* getPageDatasByChunk(
 	internals: BuildInternals,
-	chunk: RenderedChunk
+	chunk: Rollup.RenderedChunk
 ): Generator<PageBuildData, void, unknown> {
 	const pagesByViteID = internals.pagesByViteID;
 	for (const [modulePath] of Object.entries(chunk.modules)) {

diff --git a/packages/astro/src/core/build/plugins/plugin-css.ts b/packages/astro/src/core/build/plugins/plugin-css.ts
@@ -232,36 +232,6 @@ export function rollupPluginAstroBuildCSS(options: PluginOptions): VitePlugin[]
 				}
 			},
 		},
-		{
-			name: 'astro:rollup-plugin-build-css-minify',
-			enforce: 'post',
-			async generateBundle(_outputOptions, bundle) {
-				// Minify CSS in each bundle ourselves, since server builds are not minified
-				// so that the JS is debuggable. Since you cannot configure vite:css-post to minify
-				// we need to do it ourselves.
-				if (options.target === 'server') {
-					for (const [, output] of Object.entries(bundle)) {
-						if (output.type === 'asset') {
-							if (output.name?.endsWith('.css') && typeof output.source === 'string') {
-								const cssTarget = settings.config.vite.build?.cssTarget;
-								const minify = settings.config.vite.build?.minify !== false;
-								const { code: minifiedCSS } = await transformWithEsbuild(
-									output.source,
-									output.name,
-									{
-										loader: 'css',
-										minify,
-										target: cssTarget || undefined,
-										sourcemap: false,
-									}
-								);
-								output.source = minifiedCSS;
-							}
-						}
-					}
-				}
-			},
-		},
 	];
 }
 

diff --git a/packages/astro/src/core/build/plugins/plugin-internals.ts b/packages/astro/src/core/build/plugins/plugin-internals.ts
@@ -23,15 +23,6 @@ export function vitePluginInternals(input: Set<string>, internals: BuildInternal
 			return extra;
 		},
 
-		configResolved(resolvedConfig) {
-			// Delete this hook because it causes assets not to be built
-			const plugins = resolvedConfig.plugins as VitePlugin[];
-			const viteAsset = plugins.find((p) => p.name === 'vite:asset');
-			if (viteAsset) {
-				delete viteAsset.generateBundle;
-			}
-		},
-
 		async generateBundle(_options, bundle) {
 			const promises = [];
 			const mapping = new Map<string, Set<string>>();

diff --git a/packages/astro/src/core/build/static-build.ts b/packages/astro/src/core/build/static-build.ts
@@ -148,6 +148,9 @@ async function ssrBuild(
 		logLevel: opts.viteConfig.logLevel ?? 'error',
 		build: {
 			target: 'esnext',
+			// Vite defaults cssMinify to false in SSR by default, but we want to minify it
+			// as the CSS generated are used and served to the client.
+			cssMinify: viteConfig.build?.minify == null ? true : !!viteConfig.build?.minify,
 			...viteConfig.build,
 			emptyOutDir: false,
 			manifest: false,
@@ -173,6 +176,7 @@ async function ssrBuild(
 				},
 			},
 			ssr: true,
+			ssrEmitAssets: true,
 			// improve build performance
 			minify: false,
 			modulePreload: { polyfill: false },

diff --git a/packages/astro/test/ssr-manifest.test.js b/packages/astro/test/ssr-manifest.test.js
@@ -23,6 +23,6 @@ describe('astro:ssr-manifest', () => {
 		const html = await response.text();
 
 		const $ = cheerio.load(html);
-		expect($('#assets').text()).to.equal('["/_astro/index.1bad7273.css"]');
+		expect($('#assets').text()).to.equal('["/_astro/index.a8a337e4.css"]');
 	});
 });
diff --git a/packages/integrations/image/package.json b/packages/integrations/image/package.json
@@ -60,7 +60,7 @@
     "mocha": "^9.2.2",
     "rollup-plugin-copy": "^3.4.0",
     "sharp": "^0.31.0",
-    "vite": "^4.1.2"
+    "vite": "^4.2.1"
   },
   "peerDependencies": {
     "astro": "workspace:^2.1.9",

diff --git a/packages/integrations/mdx/package.json b/packages/integrations/mdx/package.json
@@ -70,7 +70,7 @@
     "remark-rehype": "^10.1.0",
     "remark-shiki-twoslash": "^3.1.0",
     "remark-toc": "^8.0.1",
-    "vite": "^4.1.2"
+    "vite": "^4.2.1"
   },
   "engines": {
     "node": ">=16.12.0"

diff --git a/packages/integrations/netlify/package.json b/packages/integrations/netlify/package.json
@@ -49,7 +49,7 @@
     "chai": "^4.3.6",
     "cheerio": "^1.0.0-rc.11",
     "mocha": "^9.2.2",
-    "vite": "^4.1.2"
+    "vite": "^4.2.1"
   },
   "astro": {
     "external": true

diff --git a/packages/integrations/svelte/package.json b/packages/integrations/svelte/package.json
@@ -40,7 +40,7 @@
     "astro": "workspace:*",
     "astro-scripts": "workspace:*",
     "svelte": "^3.54.0",
-    "vite": "^4.1.2"
+    "vite": "^4.2.1"
   },
   "peerDependencies": {
     "astro": "workspace:^2.1.9",

diff --git a/packages/integrations/tailwind/src/index.ts b/packages/integrations/tailwind/src/index.ts
@@ -1,5 +1,5 @@
 import load, { resolve } from '@proload/core';
-import type { AstroIntegration } from 'astro';
+import type { AstroConfig, AstroIntegration } from 'astro';
 import autoprefixerPlugin from 'autoprefixer';
 import fs from 'fs/promises';
 import path from 'path';
@@ -85,7 +85,10 @@ async function getPostCssConfig(
 	return postcssConfigResult;
 }
 
-async function getViteConfiguration(tailwindConfig: TailwindConfig, viteConfig: UserConfig) {
+async function getViteConfiguration(
+	tailwindConfig: TailwindConfig,
+	viteConfig: AstroConfig['vite']
+) {
 	// We need to manually load postcss config files because when inlining the tailwind and autoprefixer plugins,
 	// that causes vite to ignore postcss config files
 	const postcssConfigResult = await getPostCssConfig(viteConfig.root, viteConfig.css?.postcss);

diff --git a/packages/integrations/vue/package.json b/packages/integrations/vue/package.json
@@ -46,7 +46,7 @@
     "chai": "^4.3.6",
     "linkedom": "^0.14.17",
     "mocha": "^9.2.2",
-    "vite": "^4.1.2",
+    "vite": "^4.2.1",
     "vue": "^3.2.37"
   },
   "peerDependencies": {