gatsby: Error: Cannot create as TypeComposer the following value: Date.

i had same error here is my fix 1- remove node_modules && package-lock.json 2- yarn install 3- yarn start

Same issue, came up today.

Is there any fix for this?

I just ran into that error today and I’m only having 1 version of graphql installed (14.6.0, downgraded from 15.0.0). Removing node_modules & package-lock.json did not fix it.

I’m thinking of putting `rm -rf node_modules && rm -rf package-lock.json" on a keyboard shortcut though, as often as I reach for this. Just press it every morning while drinking coffee, makes node around 90% more robust.

Is this really because of gatsby-plugin-typscript? If yes, why are not more people having this issue?

Edit: Downgrading graphql to 14.6.0 and downgrading gatsby-plugin-typescript to 2.1.27 seems to have solved the issue for today.

PS: Putting this into your .bashrc or .zshrc saves you countless hours from typing it out every time:

alias fuck-off-npm="rm -rf node_modules && rm -rf package-lock.json"

Seems like npm isn’t resolving peerdeps of packages that are deep in the tree. So you’ll need to use yarn or manually install graphql => npm install graphql@^14.1.1

This worked for me (I used to work with npm till now):

1. Upgrade all packages (npm update).
2. Check if it works. If not - continue.
3. Delete .cache folder.
4. Delete node_modules folder
5. Delete package-lock.json file
6. Install Yarn (macOS: brew reinstall yarn).
7. And then run yarn install

That solved it for me. (Am I the only one feeling that npm’s latest versions are totally broken? Seems that nothing cannot be installed without the --force flag)

This was how I fixed it on my machine:

• npm uninstall graphql (I had mistakenly manually installed GraphQL)
• npm install gatsby (reinstall Gatsby)
• npm audit fix (Optionally make sure all versions are in the latest versions and are compatible) Finally run gatsby develop to start app.

FWIW: I had this error and I had just updated graphql to 15.0.0… Not even sure why graphql was in my dependencies, but once I removed it everything worked again.

For me this happened when using gatsby within lerna. I had different gatsby versions as dependencies for my packages (only two weeks ahead from each other, but looks enough in gatsby 🌍 )

Luckily I could just yarn upgrade --latest in all my packages. Problem solved.

rm -rf node_modules && rm -rf package-lock.json

a great solution! I did that, but in my case it wasn’t enough, I’ve got something like .cache blah-blah-blah, so I’ve came out with this line in my .bashrc

alias fucknpm="rm -rf .cache && rm -rf node_modules && rm package-lock.json && npm install"

Okay geez i spent 6 hours trying to figure this one out fml.

For me installing gatsby-plugin-typescript was the issue!

It depends on a package that its not even using!!! babel-plugin-remove-graphql-queries Which then in turn depends on different version of graphql and gives you a really bad day.

As a work around don’t use the official plugin but set typescript up your self:

yarn add @babel/preset-typescript --dev

Then the following needs to go into your gatsby-node.js

const resolvableExtensions = () => [`.ts`, `.tsx`]

function onCreateBabelConfig({ actions }) {
  actions.setBabelPreset({
    name: `@babel/preset-typescript`,
    options: {
       isTSX: true,
       allExtensions: true,
    },
  })
}

function onCreateWebpackConfig({ actions, loaders }) {
  const jsLoader = loaders.js()

  if (!jsLoader) {
    return
  }

  actions.setWebpackConfig({
    module: {
      rules: [
        {
          test: /\.tsx?$/,
          use: jsLoader,
        },
      ],
    },
  })
}

exports.resolvableExtensions = resolvableExtensions
exports.onCreateBabelConfig = onCreateBabelConfig
exports.onCreateWebpackConfig = onCreateWebpackConfig

Hey folks 👋 For me, the issue was that I bumped gatsby from v3 -> v4. v4 now depends on graphql@15 and my app was bundling graphql@14. Once I bumped that dep the issue went away. (and was replaced with other issues which I’m working through now…).

I was facing the same problem on my gatsby project, but the following setting in packege.json solved it.

...
  "pnpm": {
    "overrides": {
      "graphql-compose": "<=9.0.9"
    }
  }
...

If you are using yarn, perhaps you have to use resolutions.

When gatsby depends on graphql-compose@9.0.10 (9.0.10_graphql@15.8.0 in my pnpm-lock.yaml), error is thrown. I don’t understand why this problem happens, sorry.

This worked for me (I used to work with npm till now):

1. Upgrade all packages (npm update).
2. Check if it works. If not - continue.
3. Delete .cache folder.
4. Delete node_modules folder
5. Delete package-lock.json file
6. Install Yarn (macOS: brew reinstall yarn).
7. And then run yarn install

That solved it for me. (Am I the only one feeling that npm’s latest versions are totally broken? Seems that nothing cannot be installed without the --force flag)

Thank you so much, I was struggling today with this and your instructions worked for me 👏

For me the issue was that I had updated the GraphQL lib to 16.x. Using npm i graphql@^15 fixed it for me.

Still having the error… I follow all the steps above

Using environment config: ‘development’ success open and validate gatsby-configs - 0.054 s success load plugins - 1.840 s success onPreInit - 0.008 s success initialize cache - 0.014 s success copy gatsby files - 0.250 s success onPreBootstrap - 0.016 s success source and transform nodes - 30.589 s error UNHANDLED REJECTION

Error: Cannot create as TypeComposer the following value: Date.

• SchemaComposer.js:365 SchemaComposer.createTempTC [gatsby-netlify-cms-sho]/[graphql-compose]/lib/SchemaComposer.js:365:11

• SchemaComposer.js:563 SchemaComposer.addAsComposer [gatsby-netlify-cms-sho]/[graphql-compose]/lib/SchemaComposer.js:563:27

• schema-composer.js:21 createSchemaComposer [gatsby-netlify-cms-sho]/[gatsby]/dist/schema/schema-composer.js:21:18

• index.js:44 Object.<anonymous> [gatsby-netlify-cms-sho]/[gatsby]/dist/schema/index.js:44:28

• Generator.next

• new Promise

• index.js:67 Object.build [gatsby-netlify-cms-sho]/[gatsby]/dist/schema/index.js:67:17

• index.js:337 [gatsby-netlify-cms-sho]/[gatsby]/dist/bootstrap/index.js:337:32

• Generator.next

⠋ building schema npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! gatsby-netlify-cms-sho@0.0.1 develop: npm run clean && gatsby develop npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the gatsby-netlify-cms-sho@0.0.1 develop script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\PearlPay Laptop 2\AppData\Roaming\npm-cache_logs\2019-06-13T04_06_54_931Z-debug.log

Thanks for your response @bangarangler.

It’s just started working for me too, but I’m not sure I actually made any changes that fixed it, which included running npm cache verify and repeatedly deleting the .cache and node_modules folders before npm installing, but never tried deleting package-lock.json.

I reverted to a working set-up committed prior to updating deps and ran into an issue with a mozjpeg@5.0.0 postinstall test/compilation error. This was strange because I hadn’t noticed this problem before. I fixed that by installing some missing Ubuntu packages.

sudo apt install autoconf libtool pkg-config nasm build-essential

Even then, I ran into another strange issue when running gatsby develop, as it failed with error;

run graphql queriesnode: symbol lookup error: node_modules/sharp/build/Release/sharp.node: undefined symbol:

So I tried updating deps again, then immediately deleted both node_modules and .cache folders before running npm i. This time it worked and it did not warn me about any missing peer dependencies, just some warnings about fsevents which I can ignore as I’m not on a Mac. You can see the output below.

SysMan@HP-Z820-GJ7MQ:/mnt/d/Projects/Brochure/client-get-tech-gatsby-project-brochure$ rm -rf .cache
SysMan@HP-Z820-GJ7MQ:/mnt/d/Projects/Brochure/client-get-tech-gatsby-project-brochure$ rm -rf node_modules
SysMan@HP-Z820-GJ7MQ:/mnt/d/Projects/Brochure/client-get-tech-gatsby-project-brochure$ npm i

> sharp@0.21.3 install /mnt/d/Projects/Brochure/client-get-tech-gatsby-project-brochure/node_modules/gatsby-plugin-manifest/node_modules/sharp
> (node install/libvips && node install/dll-copy && prebuild-install) || (node-gyp rebuild && node install/dll-copy)

info sharp Using cached /home/SysMan/.npm/_libvips/libvips-8.7.0-linux-x64.tar.gz

> sharp@0.21.3 install /mnt/d/Projects/Brochure/client-get-tech-gatsby-project-brochure/node_modules/sharp
> (node install/libvips && node install/dll-copy && prebuild-install) || (node-gyp rebuild && node install/dll-copy)

info sharp Using cached /home/SysMan/.npm/_libvips/libvips-8.7.0-linux-x64.tar.gz

> gatsby-telemetry@1.0.7 postinstall /mnt/d/Projects/Brochure/client-get-tech-gatsby-project-brochure/node_modules/gatsby-telemetry
> node src/postinstall.js


> cwebp-bin@5.0.0 postinstall /mnt/d/Projects/Brochure/client-get-tech-gatsby-project-brochure/node_modules/cwebp-bin
> node lib/install.js

  ✔ cwebp pre-build test passed successfully

> mozjpeg@6.0.1 postinstall /mnt/d/Projects/Brochure/client-get-tech-gatsby-project-brochure/node_modules/mozjpeg
> node lib/install.js

  ✔ mozjpeg pre-build test passed successfully

> pngquant-bin@5.0.2 postinstall /mnt/d/Projects/Brochure/client-get-tech-gatsby-project-brochure/node_modules/pngquant-bin
> node lib/install.js

  ✔ pngquant pre-build test passed successfully
npm WARN rollback Rolling back node-pre-gyp@0.10.3 failed (this is probably harmless): EINVAL: invalid argument, scandir '/mnt/d/Projects/Brochure/client-get-tech-gatsby-project-brochure/node_modules/fsevents/node_modules'
npm WARN rollback Rolling back readable-stream@2.3.6 failed (this is probably harmless): EINVAL: invalid argument, lstat '/mnt/d/Projects/Brochure/client-get-tech-gatsby-project-brochure/node_modules/fsevents/node_modules'
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.7 (node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.7: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})

added 1863 packages from 1049 contributors and audited 26178 packages in 153.705s
found 0 vulnerabilities

SysMan@HP-Z820-GJ7MQ:/mnt/d/Projects/Brochure/client-get-tech-gatsby-project-brochure$ npm run develop

> client-get-tech-gatsby-project-brochure@1.0.0 develop /mnt/d/Projects/Brochure/client-get-tech-gatsby-project-brochure
> gatsby develop

success open and validate gatsby-configs — 0.013 s
success load plugins — 5.931 s
success onPreInit — 0.040 s
success initialize cache — 0.021 s
success copy gatsby files — 0.492 s
success onPreBootstrap — 0.013 s
success source and transform nodes — 0.333 s
success building schema — 0.571 s
success createPages — 0.002 s
success createPagesStatefully — 0.114 s
success onPreExtractQueries — 0.010 s
success update schema — 0.045 s
success extract queries from components — 0.182 s
success run graphql queries — 1.362 s — 8/8 5.89 queries/second
success write out page data — 0.034 s
success write out redirect data — 0.004 s
Generating image thumbnails [==============================] 36/36 8.3 secs 100%
success Build manifest and related icons — 0.386 s
success onPostBootstrap — 0.394 s

info bootstrap finished - 44.973 s

 DONE  Compiled successfully in 16437ms

You can now view client-get-tech-gatsby-project-brochure in the browser.

  http://localhost:8000/

View GraphiQL, an in-browser IDE, to explore your site's data and schema

  http://localhost:8000/___graphql

Note that the development build is not optimized.
To create a production build, use npm run build

ℹ ｢wdm｣:
ℹ ｢wdm｣: Compiled successfully.

I’m guessing this is a race condition in npm which fails intermittently to install all deps and peer deps in the correct order.

Anyway, its working now so I’m not going to touch anything for a while.