Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

TypeError: func is not a function #3256

Closed
alexbjorlig opened this issue Jan 8, 2020 · 32 comments
Closed

TypeError: func is not a function #3256

alexbjorlig opened this issue Jan 8, 2020 · 32 comments
Assignees
Labels
core Related to codegen core/cli

Comments

@alexbjorlig
Copy link

alexbjorlig commented Jan 8, 2020

When running graphql-codegen to generate typings, our team suddenly started to get this error today, after months of working without issues. I updated to latest version of all plugins, but the issue persists:

TypeError: func is not a function
    at <path-to-project-folder>/node_modules/@graphql-codegen/visitor-plugin-common/index.cjs.js:259:19
    at Array.map (<anonymous>)
    at convertNameParts (<path-to-project-folder>/node_modules/@graphql-codegen/visitor-plugin-common/index.cjs.js:259:10)
    at opts (<path-to-project-folder>/node_modules/@graphql-codegen/visitor-plugin-common/index.cjs.js:425:24)
    at Object.convert (<path-to-project-folder>/node_modules/@graphql-codegen/visitor-plugin-common/index.cjs.js:462:43)
    at TsVisitor.convertName (<path-to-project-folder>/node_modules/@graphql-codegen/visitor-plugin-common/index.cjs.js:488:78)
    at TsVisitor._getTypeForNode (<path-to-project-folder>/node_modules/@graphql-codegen/visitor-plugin-common/index.cjs.js:889:21)
    at TsVisitor.NamedType (<path-to-project-folder>/node_modules/@graphql-codegen/visitor-plugin-common/index.cjs.js:892:21)
    at TsVisitor.NamedType (<path-to-project-folder>/node_modules/@graphql-codegen/typescript/index.cjs.js:101:31)
    at Object.visit (<path-to-project-folder>/node_modules/graphql/language/visitor.js:242:26)
    at Object.plugin (<path-to-project-folder>/node_modules/@graphql-codegen/typescript/index.cjs.js:195:35)
    at executePlugin (<path-to-project-folder>/node_modules/@graphql-codegen/core/index.cjs.js:50:41)
    at <path-to-project-folder>/node_modules/@graphql-codegen/core/index.cjs.js:106:30
    at Array.map (<anonymous>)
    at Object.codegen (<path-to-project-folder>/node_modules/@graphql-codegen/core/index.cjs.js:96:54)
    at processTicksAndRejections (internal/process/task_queues.js:93:5)

Update - seems like the issue is only above version 1.9.1.

Expected behavior
Generated types

Environment:

  • OS: MacOS 10.14.6
  • "@graphql-codegen/cli": "^1.11.2",
  • "@graphql-codegen/typescript": "^1.11.2",
  • "@graphql-codegen/typescript-apollo-angular": "^1.11.2",
  • "@graphql-codegen/typescript-operations": "^1.11.2",
  • "@graphql-codegen/typescript-resolvers": "^1.11.2",
  • NodeJS: 12.11.1

codegen.yml

schema: http://localhost:1337/graphql
generates:
  ./src/app/eddy/generated/graphql.ts:
    schema: ./src/app/eddy/modules/graphql/client-schema.ts
    documents: ./src/**/*.graphql
    config:
      ngModule: ../modules/graphql-lazy-service/graphql-lazy-service.module#GraphqlLazyServiceModule
    plugins:
      - typescript
      - typescript-operations
      - typescript-apollo-angular
  ./aveiro-server/src/graphql/generated/resolvers-types.ts:
    plugins:
      - typescript
      - typescript-resolvers
    config:
      scalars:
        ObjectId: GQLObjectId
        Date: GQLDate

require:
  - ts-node/register

Workaround
Fix versions in your package.json:
"@graphql-codegen/cli": "1.9.1",
"@graphql-codegen/typescript": "1.9.1",
"@graphql-codegen/typescript-apollo-angular": "1.9.1",
"@graphql-codegen/typescript-operations": "1.9.1",
"@graphql-codegen/typescript-resolvers": "1.9.1",

@evark
Copy link

evark commented Jan 8, 2020

same here...
up to 1.9.1 everything is OK.
from 1.10.0 I get this error.

@alexbjorlig
Copy link
Author

I can confirm that the problem also starts with 1.10.0 in our project

@ardatan
Copy link
Collaborator

ardatan commented Jan 9, 2020

@dauledk @evark Could you reproduce it using this codesandbox template?
https://codesandbox.io/s/github/dotansimha/graphql-code-generator-issue-sandbox-template

@alexbjorlig
Copy link
Author

Hi @ardatan, to be honest, I don't know where to start - I am not very familiar with codesandbox. Given the link you provided me, how do I create an Angular project 🤷🏾‍♂️?
We are using an apollo express node.js + Angular project. I will just update the issue with our codegen.yml file, if it can maybe help. I was really hoping that the stack trace would tell you something 😅

@alexbjorlig
Copy link
Author

alexbjorlig commented Jan 9, 2020

@ardatan I tried reproducing this error, it's not easy but I finally found something! It seems like the error is not related to the setup (client or server) at all - but has something to do with versioning - maybe npm.

When I removed the package-lock.json (something I otherwise always try to avoid as a solution) and did a fresh install with npm i @graphql-codegen/{cli,typescript,typescript-apollo-angular,typescript-operations,typescript-resolvers}@latest, the error was gone 🤔

Only thing is that now, I can't reproduce 🤷🏾‍♂️

@evark
Copy link

evark commented Jan 9, 2020

OK! after deleting node_modules/package-lock.json and reinstall everything codegen works normally. It seems that some dependency is not updated with the normal update of the package. Full reinstall is needed.

@desbrowne
Copy link

In our case, the pascal-case dependency (v2.0.0) didn't match the included type definition. The type def is import { pascalCase } from 'pascal-case' where as the js seems to be exporting the func as default, e.g. import pascalCase from 'pascal-case'.

I just tried installing the latest version of pascal-case (v3.1.1) explicitly and it fixed the issue.

@saostad
Copy link

saostad commented Jan 14, 2020

it looks graphql-codegen has a dependency of "change-case": "^3.0.0", but change-case has dependency of "pascal-case": "^2.0.0",
so I think we need to update change-case to latest version.
npm i -D change-case (it worked for me!)

or wait for maintainers to update the dependency to "change-case": "^4.1.1"

@dotansimha
Copy link
Owner

@ardatan is it fixed?

@dotansimha dotansimha added bug core Related to codegen core/cli labels Jan 22, 2020
@ardatan
Copy link
Collaborator

ardatan commented Jan 22, 2020

@dotansimha We don't use change-case anymore and I don't think even npm gets confused with ^ :)

@bezreyhan
Copy link

I just installed @graphql-codegen/cli on an existing project and hit this error. I tried deleting package-lock but that did not fix the issue. Downgrading to v1.9.1 resolved it.

@aya-eiya
Copy link

aya-eiya commented Mar 15, 2021

this cause again in case using

"@graphql-codegen/typescript-operations": "1.17.15",

not cause on 1.17.14.

once updated to '1.17.15' then even if I revert the version, the problem will continue to occur.
some dependencies in this module must be the cause.

@aya-eiya
Copy link

my other plugins and changed dependencies.

  "devDependencies": {
    "@graphql-codegen/cli": "^1.21.2",
    "@graphql-codegen/typescript-operations": "1.17.14",
    "@graphql-codegen/typescript-react-query": "^1.2.3",
}
diff --git a/frontend/package.json b/frontend/package.json
index 05e7fbb..ffe7946 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -30,7 +30,7 @@
   },
   "devDependencies": {
     "@graphql-codegen/cli": "^1.21.2",
-    "@graphql-codegen/typescript-operations": "1.17.14",
+    "@graphql-codegen/typescript-operations": "1.17.15",
     "@graphql-codegen/typescript-react-query": "^1.2.3",
     "@testing-library/react-hooks": "^5.1.0",
     "@types/jest": "^26.0.20",
diff --git a/yarn.lock b/yarn.lock
index 7f8fd35..5572c16 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -834,14 +834,14 @@
     lodash "~4.17.20"
     tslib "~2.1.0"
-"@graphql-codegen/typescript-operations@1.17.14":
-  version "1.17.14"
-  resolved "https://registry.yarnpkg.com/@graphql-codegen/typescript-operations/-/typescript-operations-1.17.14.tgz#69b4bee4d66f2ea7e288f1be889e08946ef3452a"
-  integrity sha512-jf1KnkA0i5hQNwc7bdMg5G6305DMSeTGDJSDoFryA2Tt9czWxY78m10/6GueUWo3zP6FIEhW1QRSve8ewTKEMg==
+"@graphql-codegen/typescript-operations@1.17.15":
+  version "1.17.15"
+  resolved "https://registry.yarnpkg.com/@graphql-codegen/typescript-operations/-/typescript-operations-1.17.15.tgz#c992e29ead1cf5c3f65dbbe1f522b09be30c36d6"
+  integrity sha512-HStWj3mUe+0ir2J0jqgjegrvcO1DIe2gzsoBBo9RHIYwyaxedUivxXvWY9XBfKpHv6sLa/ST1iYGeedrJELPtw==
   dependencies:
-    "@graphql-codegen/plugin-helpers" "^1.18.2"
-    "@graphql-codegen/typescript" "^1.20.1"
-    "@graphql-codegen/visitor-plugin-common" "^1.18.1"
+    "@graphql-codegen/plugin-helpers" "^1.18.3"
+    "@graphql-codegen/typescript" "^1.21.1"
+    "@graphql-codegen/visitor-plugin-common" "^1.19.0"
     auto-bind "~4.0.0"
     tslib "~2.1.0"
@@ -856,30 +856,14 @@
     change-case-all "^1.0.12"
     tslib "~2.1.0"
-"@graphql-codegen/typescript@^1.20.1":
-  version "1.21.0"
-  resolved "https://registry.yarnpkg.com/@graphql-codegen/typescript/-/typescript-1.21.0.tgz#301b1851cd278bedd1f49e1b3d654f4dc0af2943"
-  integrity sha512-23YttnZ+87dA/3lbCvPKdsrpEOx142dCT9xSh6XkSeyCvn+vUtETN2MhamCYB87G7Nu2EcLDFKDZjgXH73f4fg==
-  dependencies:
-    "@graphql-codegen/plugin-helpers" "^1.18.2"
-    "@graphql-codegen/visitor-plugin-common" "^1.18.3"
-    auto-bind "~4.0.0"
-    tslib "~2.1.0"
-
-"@graphql-codegen/visitor-plugin-common@^1.18.1", "@graphql-codegen/visitor-plugin-common@^1.18.3":
-  version "1.18.3"
-  resolved "https://registry.yarnpkg.com/@graphql-codegen/visitor-plugin-common/-/visitor-plugin-common-1.18.3.tgz#9d2c4449c3bdaffe3e782e2321fe0cb998b8a91d"
-  integrity sha512-6xJzt8hszCTKt3rTlcCURpuiAFuaiaZgStlVeRE1OrKEDiY1T3vwF3/7TonhfnEjqBWtZdMmXvNx3ArXkRUV4w==
+"@graphql-codegen/typescript@^1.21.1":
+  version "1.21.1"
+  resolved "https://registry.yarnpkg.com/@graphql-codegen/typescript/-/typescript-1.21.1.tgz#9bce3254b8ef30a6bf64e57ba3991f9be7a19b53"
+  integrity sha512-JF6Vsu5HSv3dAoS2ca3PFLUN0qVxotex/+BgWw/6SKhtd83MUPnzJ/RU3lACg4vuNTCWeQSeGvg8x5qrw9Go9w==
   dependencies:
-    "@graphql-codegen/plugin-helpers" "^1.18.2"
-    "@graphql-tools/optimize" "^1.0.1"
-    "@graphql-tools/relay-operation-optimizer" "^6"
-    array.prototype.flatmap "^1.2.4"
+    "@graphql-codegen/plugin-helpers" "^1.18.3"
+    "@graphql-codegen/visitor-plugin-common" "^1.19.0"
     auto-bind "~4.0.0"
-    dependency-graph "^0.10.0"
-    graphql-tag "^2.11.0"
-    parse-filepath "^1.0.2"
-    pascal-case "^3.1.1"
     tslib "~2.1.0"
 "@graphql-codegen/visitor-plugin-common@^1.19.0":
@@ -4382,11 +4366,6 @@ depd@~1.1.2:
   resolved "https://registry.yarnpkg.com/depd/-/depd-1.1.2.tgz#9bcd52e14c097763e749b274c4346ed2e560b5a9"
   integrity sha1-m81S4UwJd2PnSbJ0xDRu0uVgtak=
-dependency-graph@^0.10.0:
-  version "0.10.0"
-  resolved "https://registry.yarnpkg.com/dependency-graph/-/dependency-graph-0.10.0.tgz#dfebe384f1f36faf7782be203a7a71102a6335a6"
-  integrity sha512-c9amUgpgxSi1bE5/sbLwcs5diLD0ygCQYmhfM5H1s5VH1mCsYkcmAL3CcNdv4kdSw6JuMoHeDGzLgj/gAXdWVg==
-
 dependency-graph@^0.11.0:
   version "0.11.0"
   resolved "https://registry.yarnpkg.com/dependency-graph/-/dependency-graph-0.11.0.tgz#ac0ce7ed68a54da22165a85e97a01d53f5eb2e27"

@tschechniker
Copy link

Hi,

it "@graphql-codegen/visitor-plugin-common" which brakes with V 1.19.0. If you add this to you dep list it's working again:

"@graphql-codegen/visitor-plugin-common": "1.18.3",

@tkvlnk
Copy link

tkvlnk commented Mar 15, 2021

seems exact package which causes issue is change-case-all

if you will explicitly lock it's version on 1.0.12 it will work fine

@aya-eiya
Copy link

aya-eiya commented Mar 15, 2021

@tschechniker @tkvlnk

thank you for reply.

I thought the cause is change-case-all or visitor-plugin-common too, and I locked the versions of them but both fix did not work for me.

even if I don't upgrade the version,yarn upgrade causes the problem too.

here is the another module case I found .

"@graphql-codegen/typescript-react-query": "1.2.2",

will work, and

"@graphql-codegen/typescript-react-query": "1.2.3",

will not.
in this case, when revert the version, it works again.

my workaround: fix versions of the modules to be 1.17.14 and 1.2.2, and not to run yarn upgrade.

@dotansimha
Copy link
Owner

I suspect it might happen due visitor-plugin-common - can you please try to make sure you are using the latest one? Can you please share the output of yarn why @graphql-codegen/visitor-plugin-common ?

I suspect that the change of change-case-all in visitor-plugin-common might be related as well, since it can conflict if you have multiple/outdated versions of visitor-plugin-common.

@Demidea
Copy link

Demidea commented Mar 15, 2021

Same situation here... I also think that problem is in visitor-plugin-common

yarn why v1.22.10
warning ../../../package.json: No license field
[1/4] 🤔 Why do we have the module "@graphql-codegen/visitor-plugin-common"...?
[2/4] 🚚 Initialising dependency graph...
[3/4] 🔍 Finding dependency...
[4/4] 🚡 Calculating file sizes...
=> Found "@graphql-codegen/visitor-plugin-common@1.19.0"
info Reasons this module exists

  • "@graphql-codegen#typescript" depends on it
  • Hoisted from "@graphql-codegen#typescript#@graphql-codegen#visitor-plugin-common"
  • Hoisted from "@graphql-codegen#typescript-document-nodes#@graphql-codegen#visitor-plugin-common"
  • Hoisted from "@graphql-codegen#typescript-mongodb#@graphql-codegen#visitor-plugin-common"
  • Hoisted from "@graphql-codegen#typescript-operations#@graphql-codegen#visitor-plugin-common"
  • Hoisted from "@graphql-codegen#typescript-react-apollo#@graphql-codegen#visitor-plugin-common"
  • Hoisted from "@graphql-codegen#typescript-resolvers#@graphql-codegen#visitor-plugin-common"
    info Disk size without dependencies: "1012KB"
    info Disk size with unique dependencies: "2.05MB"
    info Disk size with transitive dependencies: "44.32MB"
    info Number of shared dependencies: 145
    ✨ Done in 3.85s.

@Everspace
Copy link

Codesandbox with the error: https://codesandbox.io/s/wispy-darkness-nxtp9

@vladpuz
Copy link

vladpuz commented Mar 15, 2021

Today, until about 8 o'clock GMT, I set up typescript type generation, but after an hour everything just stopped working, I didn't change the versions. I perform the steps from the README and this error is returned 😕

@ardatan
Copy link
Collaborator

ardatan commented Mar 15, 2021

We're aware of the issue and working on it.
Thanks for your patience.

ardatan added a commit that referenced this issue Mar 15, 2021

Unverified

This user has not yet uploaded their public signing key.
… workaround #3256
ardatan added a commit that referenced this issue Mar 15, 2021

Unverified

This user has not yet uploaded their public signing key.
… workaround #3256 (#5710)
@ardatan
Copy link
Collaborator

ardatan commented Mar 15, 2021

Could you all update all codegen packages to the latest version and try again?

@AhmedBHameed
Copy link

Work perfectly with the current versions. Thank you @ardatan

    "@graphql-codegen/cli": "1.21.3",
    "@graphql-codegen/introspection": "1.18.1",
    "@graphql-codegen/typescript": "1.21.1",
    "@graphql-codegen/typescript-operations": "1.17.15",
    "@graphql-codegen/typescript-react-apollo": "2.2.3",

@maxhaider
Copy link

maxhaider commented Mar 15, 2021

I sadly still experience the same issue.
TypeError: func is not a function

"@graphql-codegen/cli": "1.21.3",
"@graphql-codegen/introspection": "1.18.1",
"@graphql-codegen/typescript": "1.21.1",
"@graphql-codegen/typescript-operations": "1.17.15",
"@graphql-codegen/typescript-react-apollo": "2.2.3",

@ardatan
Copy link
Collaborator

ardatan commented Mar 15, 2021

@maxhaider Could you run yarn upgrade and try again?

@pradyum98
Copy link

It worked ! Thanks a ton ! @ardatan

@maxhaider
Copy link

maxhaider commented Mar 15, 2021

@ardatan After running yarn upgrade, the error disappeared.
However now I get:

Plugin "typescript-react-apollo" requires extension to be ".ts" or ".tsx"!
    Error: Plugin "typescript-react-apollo" validation failed:
        at executePlugin (<path-to-project>/node_modules/@graphql-codegen/core/index.cjs.js:33:19)
        at async <path-to-project>/node_modules/@graphql-codegen/core/index.cjs.js:116:24
        at async Promise.all (index 2)
        at async Object.codegen (<path-to-project>/node_modules/@graphql-codegen/core/index.cjs.js:106:20)
        at async process (<path-to-project>/node_modules/@graphql-codegen/cli/bin.js:942:56)
        at async Promise.all (index 0)
        at async <path-to-project>/node_modules/@graphql-codegen/cli/bin.js:949:37
        at async Task.task (<path-to-project>/node_modules/@graphql-codegen/cli/bin.js:727:17)
    Error: Plugin "typescript-react-apollo" validation failed:
        at executePlugin (<path-to-project>/node_modules/@graphql-codegen/core/index.cjs.js:33:19)
        at async <path-to-project>/node_modules/@graphql-codegen/core/index.cjs.js:116:24
        at async Promise.all (index 2)
        at async Object.codegen (<path-to-project>/node_modules/@graphql-codegen/core/index.cjs.js:106:20)
        at async process (<path-to-project>/node_modules/@graphql-codegen/cli/bin.js:942:56)
        at async Promise.all (index 0)
        at async <path-to-project>/node_modules/@graphql-codegen/cli/bin.js:949:37
        at async Task.task (<path-to-project>/node_modules/@graphql-codegen/cli/bin.js:727:17)

@ardatan
Copy link
Collaborator

ardatan commented Mar 15, 2021

Could you share codegen.yml file? @maxhaider

@maxhaider
Copy link

I'm using a codegen.js file

const dotenv = require('dotenv')

dotenv.config();

const apiSchema = {
  [`${process.env.GRAPHQL_URL}`]: {},
}

const generateOptions = {
  plugins: ["typescript", "typescript-operations", "typescript-react-apollo"],
  config: {
    skipTypename: false,
    withHooks: true,
    withHOC: false,
    withComponent: false,
    apolloReactHooksImportFrom: "@apollo/client",
  },
}

module.exports = {
  overwrite: true,
  generates: {
    [`${process.env.GRAPHQL_URL}`]: {
      schema: apiSchema,
      documents: ["./src/api/graphql/mutations/*.gql", "./src/api/graphql/queries/*.gql"],
      ...generateOptions,
    },
  },
}

@ardatan
Copy link
Collaborator

ardatan commented Mar 15, 2021

Your configuration seems wrong. Under generates, we should have the output filenames

const dotenv = require('dotenv')

dotenv.config();

const apiSchema= {
  [`${process.env.GRAPHQL_URL}`]: {},
}

const generateOptions = {
  plugins: ["typescript", "typescript-operations", "typescript-react-apollo"],
  config: {
    skipTypename: false,
    withHooks: true,
    withHOC: false,
    withComponent: false,
    apolloReactHooksImportFrom: "@apollo/client",
  },
}

module.exports = {
  overwrite: true,
  generates: {
    'output.tsx': { // This should be the name of the output file 
      schema: apiSchema,
      documents: ["./src/api/graphql/mutations/*.gql", "./src/api/graphql/queries/*.gql"],
      ...generateOptions,
    },
  },
}

Instead of using js file, I'd recommend to have YML file like below;

schema: ${GRAPHQL_URL}
documents:
  - ./src/api/graphql/mutations/*.gql
  - ./src/api/graphql/queries/*.gql
generates:
  output.tsx:
    plugins:
      - typescript
      - typescript-operations
      - typescript-react-apollo
    config:
      skipTypename: false
      withHooks: true
      withHOC: false
      withComponent: false
      apolloReactHooksImportFrom: "@apollo/client"

And you can run codegen with dotenv like this;

yarn graphql-codegen -r dotenv/config

@maxhaider
Copy link

@ardatan thank you so much, you are the best!

@aya-eiya
Copy link

@ardatan It works perfectly too! thank you!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
core Related to codegen core/cli
Projects
None yet
Development

No branches or pull requests