fix(cli-utils): Support @vue/language-core@2.0.28 changes (#353)

0no-co · Jul 30, 2024 · 4a7844f · 4a7844f
1 parent 7bcdac9
commit 4a7844f
Show file tree

Hide file tree

Showing 5 changed files with 285 additions and 116 deletions.
diff --git a/.changeset/shaggy-rivers-move.md b/.changeset/shaggy-rivers-move.md
@@ -0,0 +1,5 @@
+---
+"@gql.tada/cli-utils": patch
+---
+
+Support breaking changes in `@vue/language-core@2.0.28` (`getBasePlugins` renamed to `createPlugins`)
diff --git a/packages/cli-utils/package.json b/packages/cli-utils/package.json
@@ -59,7 +59,7 @@
     "@0no-co/graphqlsp": "^1.12.9",
     "@gql.tada/internal": "workspace:*",
     "@vue/compiler-dom": "^3.4.23",
-    "@vue/language-core": "^2.0.17",
+    "@vue/language-core": "~2.0.0",
     "graphql": "^15.5.0 || ^16.0.0 || ^17.0.0",
     "svelte2tsx": "^0.7.6"
   },

diff --git a/packages/cli-utils/src/ts/transformers/index.ts b/packages/cli-utils/src/ts/transformers/index.ts
@@ -2,30 +2,33 @@ import type ts from 'typescript';
 import * as path from 'node:path';
 import type { VirtualCode } from '@vue/language-core';
 
-let _transformSvelte: typeof import('./svelte').transform;
-let _transformVue: typeof import('./vue').transform;
+let _svelte: typeof import('./svelte');
+let _vue: typeof import('./vue');
 
 const transformSvelte = async (
-  ...args: Parameters<typeof _transformSvelte>
-): Promise<ReturnType<typeof _transformSvelte>> => {
-  if (!_transformSvelte) _transformSvelte = (await import('./svelte')).transform;
-  return _transformSvelte(...args);
+  ...args: Parameters<typeof _svelte.transform>
+): Promise<ReturnType<typeof _svelte.transform>> => {
+  return (_svelte || (_svelte = await import('./svelte'))).transform(...args);
 };
 
 const transformVue = async (
-  ...args: Parameters<typeof _transformVue>
-): Promise<ReturnType<typeof _transformVue>> => {
-  if (!_transformVue) _transformVue = (await import('./vue')).transform;
-  return _transformVue(...args);
+  ...args: Parameters<typeof _vue.transform>
+): Promise<ReturnType<typeof _vue.transform>> => {
+  return (_vue || (_vue = await import('./vue'))).transform(...args);
+};
+
+const checkVue = async (): Promise<void> => {
+  return (_vue || (_vue = await import('./vue'))).check();
 };
 
 export const transformExtensions = ['.svelte', '.vue'] as const;
 
-export const transform = (sourceFile: ts.SourceFile): Promise<VirtualCode | undefined> => {
+export const transform = async (sourceFile: ts.SourceFile): Promise<VirtualCode | undefined> => {
   const extname = path.extname(sourceFile.fileName);
   if (extname === '.svelte') {
     return transformSvelte(sourceFile);
   } else if (extname === '.vue') {
+    await checkVue();
     return transformVue(sourceFile);
   } else {
     throw new Error(

diff --git a/packages/cli-utils/src/ts/transformers/vue.ts b/packages/cli-utils/src/ts/transformers/vue.ts
@@ -4,7 +4,7 @@ import * as vueCompilerDOM from '@vue/compiler-dom';
 import * as vue from '@vue/language-core';
 import { parse } from '@vue/language-core';
 
-const useVueFilePlugin: vue.VueLanguagePlugin = (_ctx) => {
+const useVueFilePlugin = (): vue.VueLanguagePluginReturn => {
   return {
     version: 2,
 
@@ -73,19 +73,35 @@ if ('VueVirtualCode' in vue) {
   VueVirtualCode = (vue as any).VueGeneratedCode;
 }
 
-let getBasePlugins: typeof vue.getBasePlugins | undefined;
-if ('getBasePlugins' in vue) {
-  getBasePlugins = vue.getBasePlugins;
+let createPlugins: typeof vue.createPlugins | undefined;
+if ('createPlugins' in vue) {
+  createPlugins = vue.createPlugins;
+} else if ('getBasePlugins' in vue) {
+  createPlugins = (vue as any).getBasePlugins;
 } else if ('getDefaultVueLanguagePlugins' in vue) {
-  getBasePlugins = (vue as any).getDefaultVueLanguagePlugins;
+  createPlugins = (vue as any).getDefaultVueLanguagePlugins;
 }
 
 const vueCompilerOptions = vue.resolveVueCompilerOptions({});
 
-let plugins: ReturnType<typeof vue.getBasePlugins> | undefined;
+let plugins: ReturnType<typeof vue.createPlugins> | undefined;
+
+export const check = () => {
+  const undefinedValues = [
+    !VueVirtualCode && 'VueVirtualCode',
+    !createPlugins && 'createPlugins',
+  ].filter(Boolean);
+  if (undefinedValues.length) {
+    throw new Error(
+      'This version of `@vue/language-core` seems to be unsupported. ' +
+        `(undefined: ${undefinedValues.join(', ')})\n` +
+        'Please report this issue along with your installed version of `@vue/language-core.'
+    );
+  }
+};
 
 export const transform = (sourceFile: ts.SourceFile): VirtualCode | undefined => {
-  if (!VueVirtualCode || !getBasePlugins) {
+  if (!VueVirtualCode || !createPlugins) {
     return undefined;
   } else if (!plugins) {
     const pluginContext = {
@@ -97,9 +113,8 @@ export const transform = (sourceFile: ts.SourceFile): VirtualCode | undefined =>
       globalTypesHolder: undefined,
       vueCompilerOptions,
     };
-    plugins = getBasePlugins(pluginContext);
-    const vueSfcPlugin = useVueFilePlugin(pluginContext);
-    plugins.push(vueSfcPlugin);
+    plugins = createPlugins(pluginContext);
+    plugins.push(useVueFilePlugin());
   }
 
   const snapshot = ts.ScriptSnapshot.fromString(sourceFile.getFullText());