upgrade to vite 3.1

* Support Vite 3.1

* Update ~3.1.0

* Revert Vite bump

.changeset/shaggy-books-give.md

@@ -0,0 +1,5 @@
+---
+'astro': patch
+---
+
+Support Vite 3.1

packages/astro/package.json

@@ -138,7 +138,7 @@
     "recast": "^0.20.5",
     "rehype": "^12.0.1",
     "resolve": "^1.22.0",
-    "rollup": "~2.77.0",
+    "rollup": "~2.78.0",
     "semver": "^7.3.7",
     "shiki": "^0.11.1",
     "sirv": "^2.0.2",
@@ -149,7 +149,7 @@
     "tsconfig-resolver": "^3.0.1",
     "unist-util-visit": "^4.1.0",
     "vfile": "^5.3.2",
-    "vite": "3.0.9",
+    "vite": "3.1.0",
     "yargs-parser": "^21.0.1",
     "zod": "^3.17.3"
   },

packages/astro/src/vite-plugin-astro/index.ts

@@ -340,17 +340,17 @@ ${source}
 				throw err;
 			}
 		},
-		async handleHotUpdate(this: PluginContext, context) {
+		async handleHotUpdate(context) {
 			if (context.server.config.isProduction) return;
 			const compileProps: CompileProps = {
 				config,
 				filename: context.file,
 				moduleId: context.file,
 				source: await context.read(),
-				transformStyle: createTransformStyles(styleTransformer, context.file, true, this),
+				transformStyle: createTransformStyles(styleTransformer, context.file, true),
 			};
 			const compile = () => cachedCompilation(compileProps);
-			return handleHotUpdate.call(this, context, {
+			return handleHotUpdate(context, {
 				config,
 				logging,
 				compile,

packages/astro/src/vite-style-transform/style-transform.ts

@@ -30,14 +30,8 @@ export function createTransformStyles(
 	viteStyleTransformer: ViteStyleTransformer,
 	filename: string,
 	ssr: boolean,
-	pluginContext: PluginContext
+	pluginContext?: PluginContext
 ): TransformStyle {
-	// handleHotUpdate doesn't have `addWatchFile` used by transformStyleWithVite.
-	// TODO, refactor, why is this happening *here* ?
-	if (!pluginContext.addWatchFile) {
-		pluginContext.addWatchFile = () => {};
-	}
-
 	const normalizedID = getNormalizedIDForPostCSS(filename);
 
 	return async function (styleSource, lang) {

packages/astro/src/vite-style-transform/transform-with-vite.ts

@@ -46,7 +46,10 @@ export function createTransformStyleWithViteFn(
 
 		viteDevServer?.moduleGraph.ensureEntryFromUrl(styleId, ssr, false);
 
-		const transformResult = await transformCss.call(this, source, styleId, ssr);
+		// This function could be called in a custom Vite hook like `handleHotUpdate`
+		// which doesn't have a context
+		const ctx = this ?? { addWatchFile: () => {} };
+		const transformResult = await transformCss.call(ctx, source, styleId, ssr);
 
 		// NOTE: only `code` and `map` are returned by vite:css
 		const { code, map } = transformResult;

packages/astro/test/astro-scripts.test.js

@@ -119,7 +119,8 @@ describe('Scripts (hoisted and not)', () => {
 			let html = await fixture.readFile('/with-styles/index.html');
 			let $ = cheerio.load(html);
 
-			expect($('link[rel=stylesheet]')).to.have.a.lengthOf(1);
+			// Imported styles + tailwind
+			expect($('link[rel=stylesheet]')).to.have.a.lengthOf(2);
 		});
 	});
 
@@ -150,5 +151,21 @@ describe('Scripts (hoisted and not)', () => {
 			});
 			expect(found).to.equal(1);
 		});
+
+		it('Using injectScript does not interfere', async () => {
+			let res = await fixture.fetch('/inline-in-page');
+			let html = await res.text();
+			let $ = cheerio.load(html);
+			let found = 0;
+			let moduleScripts = $('[type=module]');
+			moduleScripts.each((i, el) => {
+				if (
+					$(el).attr('src').includes('?astro&type=script&index=0&lang.ts')
+				) {
+					found++;
+				}
+			});
+			expect(found).to.equal(1);
+		});
 	});
 });

packages/astro/test/fixtures/astro-scripts/astro.config.mjs

@@ -0,0 +1,8 @@
+import { defineConfig } from 'astro/config';
+import tailwind from '@astrojs/tailwind';
+
+export default defineConfig({
+	integrations: [
+		tailwind()
+	]
+})

packages/astro/test/fixtures/astro-scripts/package.json

@@ -3,6 +3,7 @@
   "version": "0.0.0",
   "private": true,
   "dependencies": {
-    "astro": "workspace:*"
+    "astro": "workspace:*",
+    "@astrojs/tailwind": "workspace:*"
   }
 }

packages/astro/test/fixtures/astro-scripts/src/pages/inline-in-page.astro

@@ -0,0 +1,12 @@
+
+<html>
+<head>
+	<title>Testing</title>
+</head>
+<body>
+	<h1>Testing</h1>
+	<script>
+		console.log('hi');
+	</script>
+</body>
+</html>

pnpm-lock.yaml

@@ -404,7 +404,7 @@ importers:
       recast: ^0.20.5
       rehype: ^12.0.1
       resolve: ^1.22.0
-      rollup: ~2.77.0
+      rollup: ~2.78.0
       sass: ^1.52.2
       semver: ^7.3.7
       shiki: ^0.11.1
@@ -417,7 +417,7 @@ importers:
       tsconfig-resolver: ^3.0.1
       unist-util-visit: ^4.1.0
       vfile: ^5.3.2
-      vite: 3.0.9
+      vite: 3.1.0
       yargs-parser: ^21.0.1
       zod: ^3.17.3
     dependencies:
@@ -464,7 +464,7 @@ importers:
       recast: 0.20.5
       rehype: 12.0.1
       resolve: 1.22.1
-      rollup: 2.77.3
+      rollup: 2.78.1
       semver: 7.3.7
       shiki: 0.11.1
       sirv: 2.0.2
@@ -475,7 +475,7 @@ importers:
       tsconfig-resolver: 3.0.1
       unist-util-visit: 4.1.1
       vfile: 5.3.5
-      vite: 3.0.9_sass@1.54.9
+      vite: 3.1.0_sass@1.54.9
       yargs-parser: 21.1.1
       zod: 3.19.1
     devDependencies:
@@ -1356,8 +1356,10 @@ importers:
 
   packages/astro/test/fixtures/astro-scripts:
     specifiers:
+      '@astrojs/tailwind': workspace:*
       astro: workspace:*
     dependencies:
+      '@astrojs/tailwind': link:../../../../integrations/tailwind
       astro: link:../../..
 
   packages/astro/test/fixtures/astro-sitemap-rss:
@@ -15819,14 +15821,6 @@ packages:
     dependencies:
       estree-walker: 0.6.1
 
-  /rollup/2.77.3:
-    resolution: {integrity: sha512-/qxNTG7FbmefJWoeeYJFbHehJ2HNWnjkAFRKzWN/45eNBBF/r8lo992CwcJXEzyVxs5FmfId+vTSTQDb+bxA+g==}
-    engines: {node: '>=10.0.0'}
-    hasBin: true
-    optionalDependencies:
-      fsevents: 2.3.2
-    dev: false
-
   /rollup/2.78.1:
     resolution: {integrity: sha512-VeeCgtGi4P+o9hIg+xz4qQpRl6R401LWEXBmxYKOV4zlF82lyhgh2hTZnheFUbANE8l2A41F458iwj2vEYaXJg==}
     engines: {node: '>=10.0.0'}
@@ -17328,34 +17322,6 @@ packages:
       - supports-color
     dev: false
 
-  /vite/3.0.9_sass@1.54.9:
-    resolution: {integrity: sha512-waYABTM+G6DBTCpYAxvevpG50UOlZuynR0ckTK5PawNVt7ebX6X7wNXHaGIO6wYYFXSM7/WcuFuO2QzhBB6aMw==}
-    engines: {node: ^14.18.0 || >=16.0.0}
-    hasBin: true
-    peerDependencies:
-      less: '*'
-      sass: '*'
-      stylus: '*'
-      terser: ^5.4.0
-    peerDependenciesMeta:
-      less:
-        optional: true
-      sass:
-        optional: true
-      stylus:
-        optional: true
-      terser:
-        optional: true
-    dependencies:
-      esbuild: 0.14.54
-      postcss: 8.4.16
-      resolve: 1.22.1
-      rollup: 2.77.3
-      sass: 1.54.9
-    optionalDependencies:
-      fsevents: 2.3.2
-    dev: false
-
   /vite/3.1.0:
     resolution: {integrity: sha512-YBg3dUicDpDWFCGttmvMbVyS9ydjntwEjwXRj2KBFwSB8SxmGcudo1yb8FW5+M/G86aS8x828ujnzUVdsLjs9g==}
     engines: {node: ^14.18.0 || >=16.0.0}
@@ -17383,6 +17349,34 @@ packages:
       fsevents: 2.3.2
     dev: false
 
+  /vite/3.1.0_sass@1.54.9:
+    resolution: {integrity: sha512-YBg3dUicDpDWFCGttmvMbVyS9ydjntwEjwXRj2KBFwSB8SxmGcudo1yb8FW5+M/G86aS8x828ujnzUVdsLjs9g==}
+    engines: {node: ^14.18.0 || >=16.0.0}
+    hasBin: true
+    peerDependencies:
+      less: '*'
+      sass: '*'
+      stylus: '*'
+      terser: ^5.4.0
+    peerDependenciesMeta:
+      less:
+        optional: true
+      sass:
+        optional: true
+      stylus:
+        optional: true
+      terser:
+        optional: true
+    dependencies:
+      esbuild: 0.15.7
+      postcss: 8.4.16
+      resolve: 1.22.1
+      rollup: 2.78.1
+      sass: 1.54.9
+    optionalDependencies:
+      fsevents: 2.3.2
+    dev: false
+
   /vitest/0.20.3:
     resolution: {integrity: sha512-cXMjTbZxBBUUuIF3PUzEGPLJWtIMeURBDXVxckSHpk7xss4JxkiiWh5cnIlfGyfJne2Ii3QpbiRuFL5dMJtljw==}
     engines: {node: '>=v14.16.0'}