fix: enable cts and mts file extensions for graphql-tag-pluck (#5030)

* fix: enable cts and mts file extensions for graphql-tag-pluck * chore: add a changelog
ardatan · Feb 7, 2023 · bb2d257 · bb2d257
1 parent ab4cf86
commit bb2d257
Show file tree

Hide file tree

Showing 4 changed files with 30 additions and 5 deletions.
diff --git a/.changeset/early-ravens-play.md b/.changeset/early-ravens-play.md
@@ -0,0 +1,6 @@
+---
+'@graphql-tools/graphql-tag-pluck': patch
+'@graphql-tools/code-file-loader': patch
+---
+
+Added the ability to parse cjs/mjs files for graphql documents
diff --git a/packages/graphql-tag-pluck/src/config.ts b/packages/graphql-tag-pluck/src/config.ts
@@ -41,6 +41,8 @@ export default function generateConfig(
   const fileExt = getExtNameFromFilePath(filePath);
   switch (fileExt) {
     case '.ts':
+    case '.cts':
+    case '.mts':
       plugins.push('typescript');
       plugins.push('importAssertions');
       break;
@@ -52,6 +54,8 @@ export default function generateConfig(
     // (unlike .tsx) and because people are seem to use it with regular file extensions
     // (e.g. .js) see https://github.com/dotansimha/graphql-code-generator/issues/1967
     case '.js':
+    case '.mjs':
+    case '.cjs':
       plugins.push('jsx', ...dynamicFlowPlugins);
       break;
     case '.jsx':

diff --git a/packages/graphql-tag-pluck/src/index.ts b/packages/graphql-tag-pluck/src/index.ts
@@ -111,7 +111,21 @@ export interface GraphQLTagPluckOptions {
   skipIndent?: boolean;
 }
 
-const supportedExtensions = ['.js', '.jsx', '.ts', '.tsx', '.flow', '.flow.js', '.flow.jsx', '.vue', '.svelte'];
+const supportedExtensions = [
+  '.js',
+  '.mjs',
+  '.cjs',
+  '.jsx',
+  '.ts',
+  '.mts',
+  '.cts',
+  '.tsx',
+  '.flow',
+  '.flow.js',
+  '.flow.jsx',
+  '.vue',
+  '.svelte',
+];
 
 // tslint:disable-next-line: no-implicit-dependencies
 function parseWithVue(vueTemplateCompiler: typeof import('@vue/compiler-sfc'), fileData: string) {
@@ -131,7 +145,7 @@ function parseWithSvelte(svelte2tsx: typeof import('svelte2tsx'), fileData: stri
 /**
  * Asynchronously plucks GraphQL template literals from a single file.
  *
- * Supported file extensions include: `.js`, `.jsx`, `.ts`, `.tsx`, `.flow`, `.flow.js`, `.flow.jsx`, `.vue`, `.svelte`
+ * Supported file extensions include: `.js`, `.mjs`, `.cjs`, `.jsx`, `.ts`, `.mts`, `.cts`, `.tsx`, `.flow`, `.flow.js`, `.flow.jsx`, `.vue`, `.svelte`
  *
  * @param filePath Path to the file containing the code. Required to detect the file type
  * @param code The contents of the file being parsed.
@@ -157,7 +171,7 @@ export const gqlPluckFromCodeString = async (
 /**
  * Synchronously plucks GraphQL template literals from a single file
  *
- * Supported file extensions include: `.js`, `.jsx`, `.ts`, `.tsx`, `.flow`, `.flow.js`, `.flow.jsx`, `.vue`, `.svelte`
+ * Supported file extensions include: `.js`, `.mjs`, `.cjs`, `.jsx`, `.ts`, `.mjs`, `.cjs`, `.tsx`, `.flow`, `.flow.js`, `.flow.jsx`, `.vue`, `.svelte`
  *
  * @param filePath Path to the file containing the code. Required to detect the file type
  * @param code The contents of the file being parsed.

diff --git a/packages/loaders/code-file/src/index.ts b/packages/loaders/code-file/src/index.ts
@@ -45,7 +45,7 @@ export type CodeFileLoaderOptions = {
 } & CodeFileLoaderConfig &
   BaseLoaderOptions;
 
-const FILE_EXTENSIONS = ['.ts', '.tsx', '.js', '.jsx', '.vue', '.svelte'];
+const FILE_EXTENSIONS = ['.ts', '.mts', '.cts', '.tsx', '.js', '.mjs', 'cjs', '.jsx', '.vue', '.svelte'];
 
 function createGlobbyOptions(options: CodeFileLoaderOptions): GlobbyOptions {
   return { absolute: true, ...options, ignore: [] };
@@ -65,7 +65,8 @@ const buildIgnoreGlob = (path: string) => `!${path}`;
  * });
  * ```
  *
- * Supported extensions include: `.ts`, `.tsx`, `.js`, `.jsx`, `.vue`, `.svelte`
+ * Supported extensions include: `.ts`, `.mts`, `.cts`, `.tsx`, `.js`, `.mjs`,
+ * `.cjs`, `.jsx`, `.vue`, `.svelte`
  */
 export class CodeFileLoader implements Loader<CodeFileLoaderOptions> {
   private config: CodeFileLoaderConfig;