@astrojs/vue - npm Package Compare versions

Comparing version 2.1.0 to 2.1.1

CHANGELOG.md

 # @astrojs/vue
 
+## 2.1.1
+
+### Patch Changes
+
+- [#6671](https://github.com/withastro/astro/pull/6671) [`d59e511d1`](https://github.com/withastro/astro/commit/d59e511d16482cfc7067555dd0a456098ec69e30) Thanks [@wulinsheng123](https://github.com/wulinsheng123)! - Supporting the top of the await syntax sugar for Vue in the template's setup
+
+- Updated dependencies [[`489dd8d69`](https://github.com/withastro/astro/commit/489dd8d69cdd9d7c243cf8bec96051a914984b9c), [`a1a4f45b5`](https://github.com/withastro/astro/commit/a1a4f45b51a80215fa7598da83bd0d9c5acd20d2), [`a1108e037`](https://github.com/withastro/astro/commit/a1108e037115cdb67d03505286c7d3a4fc2a1ff5), [`8b88e4cf1`](https://github.com/withastro/astro/commit/8b88e4cf15c8bea7942b3985380164e0edf7250b), [`d54cbe413`](https://github.com/withastro/astro/commit/d54cbe41349e55f8544212ad9320705f07325920), [`4c347ab51`](https://github.com/withastro/astro/commit/4c347ab51e46f2319d614f8577fe502e3dc816e2), [`ff0430786`](https://github.com/withastro/astro/commit/ff043078630e678348ae4f4757b3015b3b862c16), [`2f2e572e9`](https://github.com/withastro/astro/commit/2f2e572e937fd25451bbc78a05d55b7caa1ca3ec), [`7116c021a`](https://github.com/withastro/astro/commit/7116c021a39eac15a6e1264dfbd11bef0f5d618a)]:
+  - astro@2.2.0
+
 ## 2.1.0
@@ -4,0 +13,0 @@

client.js

@@ -1,2 +0,2 @@
-import { h, createSSRApp, createApp } from 'vue';
+import { h, createSSRApp, createApp, Suspense } from 'vue';
 import { setup } from 'virtual:@astrojs/vue/app';
@@ -16,8 +16,16 @@ import StaticHtml from './static-html.js';
 		}
+
+		let content = h(Component, props, slots);
+		// related to https://github.com/withastro/astro/issues/6549
+		// if the component is async, wrap it in a Suspense component
+		if (isAsync(Component.setup)) {
+			content = h(Suspense, null, content);
+		}
+
 		if (client === 'only') {
-			const app = createApp({ name, render: () => h(Component, props, slots) });
+			const app = createApp({ name, render: () => content });
 			await setup(app);
 			app.mount(element, false);
 		} else {
-			const app = createSSRApp({ name, render: () => h(Component, props, slots) });
+			const app = createSSRApp({ name, render: () => content });
 			await setup(app);
@@ -27,1 +35,6 @@ app.mount(element, true);
 	};
+
+function isAsync(fn) {
+	const constructor = fn?.constructor;
+	return constructor && constructor.name === 'AsyncFunction';
+}

package.json

 {
   "name": "@astrojs/vue",
-  "version": "2.1.0",
+  "version": "2.1.1",
   "description": "Use Vue components within Astro",
@@ -38,3 +38,3 @@ "type": "module",
     "@types/chai": "^4.3.3",
-    "astro": "2.1.0",
+    "astro": "2.2.0",
     "astro-scripts": "0.0.14",
@@ -44,7 +44,7 @@ "chai": "^4.3.6",
     "mocha": "^9.2.2",
-    "vite": "^4.1.2",
+    "vite": "^4.2.1",
     "vue": "^3.2.37"
   },
   "peerDependencies": {
-    "astro": "^2.1.0",
+    "astro": "^2.2.0",
     "vue": "^3.2.30"
@@ -51,0 +51,0 @@ },

test/app-entrypoint.test.js

 import { loadFixture } from './test-utils.js';
 import { expect } from 'chai';
 import { parseHTML } from 'linkedom';
-
 describe('App Entrypoint', () => {
@@ -6,0 +5,0 @@ /** @type {import('./test-utils').Fixture} */

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

46064

increased by3.61%

Lines of code

380

increased by2.7%

No dependency changes