From 0eb9caf0c276c604144e186655e6cb3fccc4e024 Mon Sep 17 00:00:00 2001 From: Julien Huang Date: Tue, 28 Nov 2023 00:02:02 +0100 Subject: [PATCH] fix(nuxt): remove experimental `reactivityTransform` (vue 3.4) (#24477) --- docs/1.getting-started/3.configuration.md | 4 ++++ .../3.going-further/1.experimental-features.md | 14 -------------- packages/kit/src/template.ts | 4 ---- packages/schema/src/config/experimental.ts | 10 ---------- packages/vite/src/vite.ts | 1 - packages/webpack/src/presets/vue.ts | 5 +---- test/basic.test.ts | 12 ++---------- .../components/{SugarCounter.vue => Counter.vue} | 5 +++-- .../Nested/{SugarCounter.vue => Counter.vue} | 2 +- test/fixtures/basic/components/Tsx.tsx | 2 +- test/fixtures/basic/nuxt.config.ts | 1 - test/fixtures/basic/pages/client-fallback.vue | 4 ++-- test/fixtures/basic/pages/index.vue | 6 +++--- test/fixtures/basic/pages/islands.vue | 4 ++-- 14 files changed, 19 insertions(+), 55 deletions(-) rename test/fixtures/basic/components/{SugarCounter.vue => Counter.vue} (66%) rename test/fixtures/basic/components/Nested/{SugarCounter.vue => Counter.vue} (76%) diff --git a/docs/1.getting-started/3.configuration.md b/docs/1.getting-started/3.configuration.md index 5b5b126d79..b58ea97287 100644 --- a/docs/1.getting-started/3.configuration.md +++ b/docs/1.getting-started/3.configuration.md @@ -210,4 +210,8 @@ export default defineNuxtConfig({ }) ``` +#### experimental `reactivityTransform` migration from Vue 3.4 and Nuxt 3.9 + +Since Nuxt 3.9 and Vue 3.4, `reactivityTransform` has been moved from Vue to Vue Macros which has a [Nuxt integration](https://vue-macros.dev/guide/nuxt-integration.html). + :read-more{to="/docs/api/configuration/nuxt-config#vue-1"} diff --git a/docs/2.guide/3.going-further/1.experimental-features.md b/docs/2.guide/3.going-further/1.experimental-features.md index 06ae2e59db..0bfebe9903 100644 --- a/docs/2.guide/3.going-further/1.experimental-features.md +++ b/docs/2.guide/3.going-further/1.experimental-features.md @@ -39,20 +39,6 @@ export defineNuxtConfig({ }) ``` -## reactivityTransform - -Enables Vue's reactivity transform. Note that this feature has been marked as deprecated in Vue 3.3 and is planned to be removed from core in Vue 3.4. - -```ts [nuxt.config.ts] -export defineNuxtConfig({ - experimental: { - reactivityTransform: true - } -}) -``` - -:read-more{to="/docs/getting-started/configuration#enabling-experimental-vue-features"} - ## externalVue Externalizes `vue`, `@vue/*` and `vue-router` when building. diff --git a/packages/kit/src/template.ts b/packages/kit/src/template.ts index b9eb0e82fd..8ce2e0081e 100644 --- a/packages/kit/src/template.ts +++ b/packages/kit/src/template.ts @@ -218,10 +218,6 @@ export async function writeTypes (nuxt: Nuxt) { .filter(f => typeof f === 'string') .map(async id => ({ types: (await readPackageJSON(id, { url: nodeModulePaths }).catch(() => null))?.name || id }))) - if (nuxt.options.experimental?.reactivityTransform) { - references.push({ types: 'vue/macros-global' }) - } - const declarations: string[] = [] await nuxt.callHook('prepare:types', { references, declarations, tsConfig }) diff --git a/packages/schema/src/config/experimental.ts b/packages/schema/src/config/experimental.ts index 4b63a5691e..c4d66fb841 100644 --- a/packages/schema/src/config/experimental.ts +++ b/packages/schema/src/config/experimental.ts @@ -9,16 +9,6 @@ export default defineUntypedSchema({ $resolve: val => val ?? false }, - /** - * Enable Vue's reactivity transform - * @see [Vue Reactivity Transform Docs](https://vuejs.org/guide/extras/reactivity-transform.html) - * - * Warning: Reactivity transform feature has been marked as deprecated in Vue 3.3 and is planned to be - * removed from core in Vue 3.4. - * @see [Vue RFC#369](https://github.com/vuejs/rfcs/discussions/369#discussioncomment-5059028) - */ - reactivityTransform: false, - // TODO: Remove when nitro has support for mocking traced dependencies // https://github.com/unjs/nitro/issues/1118 /** diff --git a/packages/vite/src/vite.ts b/packages/vite/src/vite.ts index 4b7f85b990..a5fde9e1a5 100644 --- a/packages/vite/src/vite.ts +++ b/packages/vite/src/vite.ts @@ -111,7 +111,6 @@ export const bundle: NuxtBuilder['bundle'] = async (nuxt) => { virtual(nuxt.vfs) ], vue: { - reactivityTransform: nuxt.options.experimental.reactivityTransform, template: { transformAssetUrls: { video: ['src', 'poster'], diff --git a/packages/webpack/src/presets/vue.ts b/packages/webpack/src/presets/vue.ts index badc026655..f3597aaf2f 100644 --- a/packages/webpack/src/presets/vue.ts +++ b/packages/webpack/src/presets/vue.ts @@ -12,10 +12,7 @@ export function vue (ctx: WebpackConfigContext) { ctx.config.module!.rules!.push({ test: /\.vue$/i, loader: 'vue-loader', - options: { - reactivityTransform: ctx.nuxt.options.experimental.reactivityTransform, - ...ctx.userConfig.loaders.vue - } + options: ctx.userConfig.loaders.vue }) if (ctx.isClient) { diff --git a/test/basic.test.ts b/test/basic.test.ts index c99c2face4..1ebf0bbf8a 100644 --- a/test/basic.test.ts +++ b/test/basic.test.ts @@ -963,14 +963,6 @@ describe('layouts', () => { }) }) -describe('reactivity transform', () => { - it('should works', async () => { - const html = await $fetch('/') - - expect(html).toContain('Sugar Counter 12 x 2 = 24') - }) -}) - describe('composable tree shaking', () => { it('should work', async () => { const html = await $fetch('/tree-shake') @@ -2020,10 +2012,10 @@ describe.skipIf(isWindows)('useAsyncData', () => { describe.runIf(isDev())('component testing', () => { it('should work', async () => { - const comp1 = await $fetchComponent('components/SugarCounter.vue', { multiplier: 2 }) + const comp1 = await $fetchComponent('components/Counter.vue', { multiplier: 2 }) expect(comp1).toContain('12 x 2 = 24') - const comp2 = await $fetchComponent('components/SugarCounter.vue', { multiplier: 4 }) + const comp2 = await $fetchComponent('components/Counter.vue', { multiplier: 4 }) expect(comp2).toContain('12 x 4 = 48') }) }) diff --git a/test/fixtures/basic/components/SugarCounter.vue b/test/fixtures/basic/components/Counter.vue similarity index 66% rename from test/fixtures/basic/components/SugarCounter.vue rename to test/fixtures/basic/components/Counter.vue index 69bdd45604..329ffc0393 100644 --- a/test/fixtures/basic/components/SugarCounter.vue +++ b/test/fixtures/basic/components/Counter.vue @@ -1,9 +1,10 @@ +