From 3dac6d8c96eebdd74cb3bb33ce8e376fbc12d848 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Arda=20Tanr=C4=B1kulu?=
 <20847995+ardatan@users.noreply.github.com>
Date: Tue, 21 Jul 2020 17:23:20 +0300
Subject: [PATCH] Add a config option to add pure magic comment for static
 global variables (#4380)

* Add a config option to add pure magic comment for static global variables

* pureMagicComment is JS specific so make it optional

* Remove extra space

* Remove annoying warning

* Fix
---
 .github/FUNDING.yml                               |  1 -
 .../src/client-side-base-visitor.ts               | 15 ++++++++++++---
 .../other/visitor-plugin-common/src/utils.ts      |  4 +++-
 3 files changed, 15 insertions(+), 5 deletions(-)

diff --git a/.github/FUNDING.yml b/.github/FUNDING.yml
index 2730947496f..2ec87519cac 100644
--- a/.github/FUNDING.yml
+++ b/.github/FUNDING.yml
@@ -1,2 +1 @@
-
 custom: https://www.buymeacoffee.com/JDnuAwr
diff --git a/packages/plugins/other/visitor-plugin-common/src/client-side-base-visitor.ts b/packages/plugins/other/visitor-plugin-common/src/client-side-base-visitor.ts
index f3848e265d7..a50a5f52bc3 100644
--- a/packages/plugins/other/visitor-plugin-common/src/client-side-base-visitor.ts
+++ b/packages/plugins/other/visitor-plugin-common/src/client-side-base-visitor.ts
@@ -130,6 +130,11 @@ export interface RawClientSideBasePluginConfig extends RawConfig {
    *
    */
   importDocumentNodeExternallyFrom?: string;
+  /**
+   * @default false
+   * @description This config adds PURE magic comment to the static variables to enforce treeshaking for your bundler.
+   */
+  pureMagicComment?: boolean;
 }
 
 export interface ClientSideBasePluginConfig extends ParsedConfig {
@@ -146,6 +151,7 @@ export interface ClientSideBasePluginConfig extends ParsedConfig {
   importDocumentNodeExternallyFrom?: 'near-operation-file' | string;
   importOperationTypesFrom?: string;
   globalNamespace?: boolean;
+  pureMagicComment?: boolean;
 }
 
 export class ClientSideBaseVisitor<
@@ -182,6 +188,7 @@ export class ClientSideBaseVisitor<
         return getConfigValue(rawConfig.documentMode, DocumentMode.graphQLTag);
       })(rawConfig),
       importDocumentNodeExternallyFrom: getConfigValue(rawConfig.importDocumentNodeExternallyFrom, ''),
+      pureMagicComment: getConfigValue(rawConfig.pureMagicComment, false),
       ...additionalConfig,
     } as any);
 
@@ -296,7 +303,9 @@ export class ClientSideBaseVisitor<
     const isDocumentNode =
       this.config.documentMode === DocumentMode.documentNode ||
       this.config.documentMode === DocumentMode.documentNodeImportFragments;
-    return `export const ${name}${isDocumentNode ? ': DocumentNode' : ''} = ${this._gql(fragmentDocument)};`;
+    return `export const ${name}${isDocumentNode ? ': DocumentNode' : ''} =${
+      this.config.pureMagicComment ? ' /*#__PURE__*/' : ''
+    } ${this._gql(fragmentDocument)};`;
   }
 
   private get fragmentsGraph(): DepGraph<LoadedFragment> {
@@ -342,7 +351,7 @@ export class ClientSideBaseVisitor<
     return localFragments.join('\n');
   }
 
-  protected _parseImport(importStr: string) {
+  protected _parseImport(importStr: string): { moduleName: string; propName: string } {
     const [moduleName, propName] = importStr.split('#');
 
     return {
@@ -443,7 +452,7 @@ export class ClientSideBaseVisitor<
         this.config.documentMode === DocumentMode.documentNodeImportFragments;
       documentString = `${this.config.noExport ? '' : 'export'} const ${documentVariableName}${
         isDocumentNode ? ': DocumentNode' : ''
-      } = ${this._gql(node)};`;
+      } =${this.config.pureMagicComment ? ' /*#__PURE__*/' : ''} ${this._gql(node)};`;
     }
 
     const operationType: string = pascalCase(node.operation);
diff --git a/packages/plugins/other/visitor-plugin-common/src/utils.ts b/packages/plugins/other/visitor-plugin-common/src/utils.ts
index 17c657c586a..85d1c714cae 100644
--- a/packages/plugins/other/visitor-plugin-common/src/utils.ts
+++ b/packages/plugins/other/visitor-plugin-common/src/utils.ts
@@ -225,7 +225,9 @@ export class DeclarationBlock {
     return (
       (this._comment ? this._comment : '') +
       result +
-      (this._kind === 'interface' || this._kind === 'enum' || this._kind === 'namespace' || this._kind === "function" ? '' : ';') +
+      (this._kind === 'interface' || this._kind === 'enum' || this._kind === 'namespace' || this._kind === 'function'
+        ? ''
+        : ';') +
       '\n'
     );
   }