diff --git a/build/src/index.js b/build/src/index.js
index 7a3e8db5bc97f3786dc14bf8555721545534a952..00ef3fed50aeb28377b94ee43d1b068bbe82f57a 100644
--- a/build/src/index.js
+++ b/build/src/index.js
@@ -37,7 +37,7 @@ const plugin = (schema, documents, config) => {
 exports.plugin = plugin;
 const validate = (schema, documents, config, outputFile) => __awaiter(void 0, void 0, void 0, function* () {
     if ((0, path_1.extname)(outputFile) !== ".tsx") {
-        throw new Error(`Plugin "react-apollo" requires extension to be ".tsx"!`);
+        throw new Error(`Plugin "apollo-next-ssr" requires extension to be ".tsx"!`);
     }
 });
 exports.validate = validate;
diff --git a/build/src/visitor.js b/build/src/visitor.js
index 4d54ec005b49f6e5227707bda340340116827b87..7777909ed08a8bb0b51f48dd07d9b8ddc562af38 100644
--- a/build/src/visitor.js
+++ b/build/src/visitor.js
@@ -46,8 +46,12 @@ class ApolloNextSSRVisitor extends visitor_plugin_common_1.ClientSideBaseVisitor
         if (this.config.withHOC) {
             this.imports.add(`import { NextPage } from 'next';`);
         }
-        this.imports.add(`import { NextRouter, useRouter } from 'next/router'`);
-        this.imports.add(`import { QueryHookOptions, useQuery } from '${this.config.apolloReactHooksImportFrom}';`);
+        if (this.config.withHOC || this.config.withHooks) {
+            this.imports.add(`import { NextRouter, useRouter } from 'next/router'`);
+        }
+        if (this.config.withHOC || this.config.withHooks) {
+            this.imports.add(`import { QueryHookOptions, useQuery } from '${this.config.apolloReactHooksImportFrom}';`);
+        }
         this.imports.add(`import * as Apollo from '${this.config.apolloImportFrom}';`);
         this.imports.add(this.config.reactImport);
         if (this.config.apolloClientInstanceImport) {
@@ -59,7 +63,10 @@ class ApolloNextSSRVisitor extends visitor_plugin_common_1.ClientSideBaseVisitor
         if (this.config.customImports) {
             this.imports.add(this.config.customImports);
         }
-        const baseImports = super.getImports();
+        let baseImports = super.getImports();
+        if (this.config.importDocumentNodeExternallyFrom === 'same-file') {
+            baseImports = baseImports.filter(importStr => !importStr.startsWith('import * as Operations from '));
+        }
         const hasOperations = this._collectedOperations.length > 0;
         if (!hasOperations) {
             return baseImports;
@@ -67,7 +74,7 @@ class ApolloNextSSRVisitor extends visitor_plugin_common_1.ClientSideBaseVisitor
         return [...baseImports, ...Array.from(this.imports)];
     }
     getDocumentNodeVariable(documentVariableName) {
-        return this.config.documentMode === visitor_plugin_common_1.DocumentMode.external
+        return this.config.documentMode === visitor_plugin_common_1.DocumentMode.external && this.config.importDocumentNodeExternallyFrom !== 'same-file'
             ? `Operations.${documentVariableName}`
             : documentVariableName;
     }
diff --git a/src/config.ts b/src/config.ts
index 7e3895f9bfb331276b5bf120e2117abae59e66a3..b7fc84dc6abb2eb40a233a43e5a8fe845fb54583 100644
--- a/src/config.ts
+++ b/src/config.ts
@@ -5,7 +5,7 @@ import { RawClientSideBasePluginConfig } from "@graphql-codegen/visitor-plugin-c
  *
  * It extends the basic TypeScript plugins: `@graphql-codegen/typescript`, `@graphql-codegen/typescript-operations` - and thus shares a similar configuration.
  */
-export type ApolloNextSSRRawPluginConfig = RawClientSideBasePluginConfig &
+export type ApolloNextSSRRawPluginConfig = Omit<RawClientSideBasePluginConfig, 'importDocumentNodeExternallyFrom'> &
   Config;
 
 export type Config = {
@@ -142,4 +142,32 @@ export type Config = {
    * @description Custom React import
    */
   reactImport?: string;
+
+  /**
+   * @default ""
+   * @description This config should be used if `documentMode` is `external`. This has 3 usage:
+   * - any string: This would be the path to import document nodes from. This can be used if we want to manually create the document nodes e.g. Use `graphql-tag` in a separate file and export the generated document
+   * - 'near-operation-file': This is a special mode that is intended to be used with `near-operation-file` preset to import document nodes from those files. If these files are `.graphql` files, we make use of webpack loader.
+   * - 'same-file': This is a special mode that is intended to be used with the `typescript-operations` & `typescript-react-apollo` plugins to generate document nodes in the same files.
+   *
+   * @exampleMarkdown
+   * ```yml
+   * config:
+   *   documentMode: external
+   *   importDocumentNodeExternallyFrom: path/to/document-node-file
+   * ```
+   *
+   * ```yml
+   * config:
+   *   documentMode: external
+   *   importDocumentNodeExternallyFrom: near-operation-file
+   * ```
+   * 
+   * ```yml
+   * config:
+   *   documentMode: external
+   *   importDocumentNodeExternallyFrom: same-file
+   * ```
+   */
+  importDocumentNodeExternallyFrom?: string;
 };
diff --git a/src/index.ts b/src/index.ts
index 34d937dc38f88879f102472c00d26c8f0902352e..20b3a853ad55868322ddcac68de8b6febcbecde1 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -63,7 +63,7 @@ export const validate: PluginValidateFn<any> = async (
   outputFile: string
 ) => {
   if (extname(outputFile) !== ".tsx") {
-    throw new Error(`Plugin "react-apollo" requires extension to be ".tsx"!`);
+    throw new Error(`Plugin "apollo-next-ssr" requires extension to be ".tsx"!`);
   }
 };
 
diff --git a/src/visitor.ts b/src/visitor.ts
index 79e4374db24e17392330d379c8a0171900bf68d4..47667fad06d67d3381c91580b3709f6f4ea2fd36 100644
--- a/src/visitor.ts
+++ b/src/visitor.ts
@@ -4,7 +4,6 @@ import {
   ClientSideBasePluginConfig,
   getConfigValue,
   LoadedFragment,
-  OMIT_TYPE,
   DocumentMode,
 } from "@graphql-codegen/visitor-plugin-common";
 
@@ -96,11 +95,15 @@ export class ApolloNextSSRVisitor extends ClientSideBaseVisitor<
     if (this.config.withHOC) {
       this.imports.add(`import { NextPage } from 'next';`);
     }
-    this.imports.add(`import { NextRouter, useRouter } from 'next/router'`);
+    if (this.config.withHOC || this.config.withHooks) {
+      this.imports.add(`import { NextRouter, useRouter } from 'next/router'`);
+    }    
+    if (this.config.withHOC || this.config.withHooks) {
+      this.imports.add(
+        `import { QueryHookOptions, useQuery } from '${this.config.apolloReactHooksImportFrom}';`
+      );
+    }
 
-    this.imports.add(
-      `import { QueryHookOptions, useQuery } from '${this.config.apolloReactHooksImportFrom}';`
-    );
     this.imports.add(
       `import * as Apollo from '${this.config.apolloImportFrom}';`
     );
@@ -120,7 +123,11 @@ export class ApolloNextSSRVisitor extends ClientSideBaseVisitor<
       this.imports.add(this.config.customImports);
     }
 
-    const baseImports = super.getImports();
+    let baseImports = super.getImports();
+    if (this.config.importDocumentNodeExternallyFrom === 'same-file') {
+      baseImports = baseImports.filter(importStr => !importStr.startsWith('import * as Operations from '))
+    }
+
     const hasOperations = this._collectedOperations.length > 0;
 
     if (!hasOperations) {
@@ -131,7 +138,7 @@ export class ApolloNextSSRVisitor extends ClientSideBaseVisitor<
   }
 
   private getDocumentNodeVariable(documentVariableName: string): string {
-    return this.config.documentMode === DocumentMode.external
+    return this.config.documentMode === DocumentMode.external && this.config.importDocumentNodeExternallyFrom !== 'same-file'
       ? `Operations.${documentVariableName}`
       : documentVariableName;
   }