Use import type in generated d.ts (#7)

* Use type imports

* Changesets

Author: frandiox

.changeset/nine-seals-deliver.md

@@ -0,0 +1,5 @@
+---
+'@shopify/graphql-codegen': patch
+---
+
+Use type imports in the generated d.ts file

README.md

@@ -82,7 +82,7 @@ export default {
       schema: './path/to/my-api-schema.json',
       documents: ['./src/graphql/my-api/*.{ts,tsx,js,jsx}'],
       presetConfig: {
-        // Generate the line `import * as MyAPI from 'path/to/my-api-types';`.
+        // Generate the line `import type * as MyAPI from 'path/to/my-api-types';`.
         // If you don't have generated types for your API beforehand,
         // omit this parameter to generate the types inline.
         importTypes: {
@@ -111,7 +111,7 @@ Then, include queries in your app that match the given schema and documents path
 
 ```ts
 // my-api.generated.d.ts
-import * as MyAPI from 'path/to/my-api-types';
+import type * as MyAPI from 'path/to/my-api-types';
 
 export type LayoutQueryVariables = MyAPI.Exact<{[key: string]: never}>;
 

examples/app/storefrontapi.generated.d.ts

@@ -1,7 +1,7 @@
 /* eslint-disable eslint-comments/disable-enable-pair */
 /* eslint-disable eslint-comments/no-unlimited-disable */
 /* eslint-disable */
-import * as StorefrontAPI from '../../tests/fixtures/storefront-api-types.d.ts';
+import type * as StorefrontAPI from '../../tests/fixtures/storefront-api-types.d.ts';
 
 export type LayoutQueryVariables = StorefrontAPI.Exact<{[key: string]: never}>;
 

src/preset.ts

@@ -90,7 +90,7 @@ export const preset: Types.OutputPreset<PresetConfig> = {
       importTypes
         ? {
             [`add`]: {
-              content: `import * as ${namespacedImportName} from '${importTypesFrom}';\n`,
+              content: `import type * as ${namespacedImportName} from '${importTypesFrom}';\n`,
             },
           }
         : {

tests/codegen.test.ts

@@ -65,7 +65,7 @@ describe('Shopify GraphQL Codegen', async () => {
 
     // Imports SFAPI
     expect(generatedCode).toMatch(
-      `import * as StorefrontAPI from './fixtures/storefront-api-types';`,
+      `import type * as StorefrontAPI from './fixtures/storefront-api-types';`,
     );
 
     // Uses Pick<...>
@@ -86,7 +86,7 @@ describe('Shopify GraphQL Codegen', async () => {
       "/* eslint-disable eslint-comments/disable-enable-pair */
       /* eslint-disable eslint-comments/no-unlimited-disable */
       /* eslint-disable */
-      import * as StorefrontAPI from './fixtures/storefront-api-types';
+      import type * as StorefrontAPI from './fixtures/storefront-api-types';
 
       export type LayoutQueryVariables = StorefrontAPI.Exact<{ [key: string]: never; }>;
 
@@ -131,7 +131,7 @@ describe('Shopify GraphQL Codegen', async () => {
       "/* eslint-disable eslint-comments/disable-enable-pair */
       /* eslint-disable eslint-comments/no-unlimited-disable */
       /* eslint-disable */
-      import * as StorefrontAPI from './fixtures/storefront-api-types';
+      import type * as StorefrontAPI from './fixtures/storefront-api-types';
 
       type Media_ExternalVideo_Fragment = (
         { __typename: 'ExternalVideo' }