fix: cloudflare resolve conditions (#476)

withastro · Dec 13, 2024 · a8a8ab1 · a8a8ab1
1 parent d9eed7e
commit a8a8ab1
Show file tree

Hide file tree

Showing 8 changed files with 839 additions and 4 deletions.
diff --git a/.changeset/rude-shoes-glow.md b/.changeset/rude-shoes-glow.md
@@ -0,0 +1,5 @@
+---
+'@astrojs/cloudflare': patch
+---
+
+Removes resolving with "node" conditionto fix Vue imports
diff --git a/packages/cloudflare/src/index.ts b/packages/cloudflare/src/index.ts
@@ -12,7 +12,7 @@ import {
 import { createRedirectsFromAstroRoutes } from '@astrojs/underscore-redirects';
 import astroWhen from '@inox-tools/astro-when';
 import { AstroError } from 'astro/errors';
-import { defaultServerConditions } from 'vite';
+import { defaultClientConditions } from 'vite';
 import { type GetPlatformProxyOptions, getPlatformProxy } from 'wrangler';
 import {
 	type CloudflareModulePluginExtra,
@@ -223,7 +223,7 @@ export default function createIntegration(args?: Options): AstroIntegration {
 					// (previously supported in esbuild instead: https://github.com/withastro/astro/pull/7092)
 					vite.ssr ||= {};
 					vite.ssr.resolve ||= {};
-					vite.ssr.resolve.conditions ||= [...defaultServerConditions];
+					vite.ssr.resolve.conditions ||= [...defaultClientConditions];
 					vite.ssr.resolve.conditions.push('workerd', 'worker');
 
 					vite.ssr.target = 'webworker';

diff --git a/packages/cloudflare/test/fixtures/with-vue/astro.config.mjs b/packages/cloudflare/test/fixtures/with-vue/astro.config.mjs
@@ -0,0 +1,9 @@
+import cloudflare from '@astrojs/cloudflare';
+import vue from "@astrojs/vue";
+import { defineConfig } from 'astro/config';
+
+export default defineConfig({
+	integrations: [vue()],
+	adapter: cloudflare(),
+	output: 'server',
+});
diff --git a/packages/cloudflare/test/fixtures/with-vue/package.json b/packages/cloudflare/test/fixtures/with-vue/package.json
@@ -0,0 +1,11 @@
+{
+  "name": "@test/astro-cloudflare-with-vue",
+  "version": "0.0.0",
+  "private": true,
+  "dependencies": {
+    "@astrojs/cloudflare": "workspace:*",
+    "@astrojs/vue": "^5.0.1",
+    "astro": "^5.0.0",
+    "vue": "^3.5.13"
+  }
+}
diff --git a/packages/cloudflare/test/fixtures/with-vue/src/components/Component.vue b/packages/cloudflare/test/fixtures/with-vue/src/components/Component.vue
@@ -0,0 +1,3 @@
+<template>
+  <div class="vue">Vue Content</div>
+</template>
diff --git a/packages/cloudflare/test/fixtures/with-vue/src/pages/index.astro b/packages/cloudflare/test/fixtures/with-vue/src/pages/index.astro
@@ -0,0 +1,13 @@
+---
+import Component from '../components/Component.vue';
+---
+
+<html>
+<head>
+	<title>Testing</title>
+</head>
+<body>
+<h1>Testing</h1>
+<Component />
+</body>
+</html>
diff --git a/packages/cloudflare/test/with-vue.test.js b/packages/cloudflare/test/with-vue.test.js
@@ -0,0 +1,37 @@
+import * as assert from 'node:assert/strict';
+import { after, before, describe, it } from 'node:test';
+import { fileURLToPath } from 'node:url';
+import * as cheerio from 'cheerio';
+import { astroCli, wranglerCli } from './_test-utils.js';
+
+const root = new URL('./fixtures/with-vue/', import.meta.url);
+
+describe('Vue', () => {
+	let wrangler;
+	before(async () => {
+		await astroCli(fileURLToPath(root), 'build');
+
+		wrangler = wranglerCli(fileURLToPath(root));
+		await new Promise((resolve) => {
+			wrangler.stdout.on('data', (data) => {
+				// console.log('[stdout]', data.toString());
+				if (data.toString().includes('http://127.0.0.1:8788')) resolve();
+			});
+			wrangler.stderr.on('data', (data) => {
+				// console.log('[stderr]', data.toString());
+			});
+		});
+	});
+
+	after((done) => {
+		wrangler.kill();
+	});
+
+	it('renders the vue component', async () => {
+		const res = await fetch('http://127.0.0.1:8788/');
+		assert.equal(res.status, 200);
+		const html = await res.text();
+		const $ = cheerio.load(html);
+		assert.equal($('.vue').text(), 'Vue Content');
+	});
+});