Uncaught TypeError: The "original" argument must be of type Function

[patrik-meixner]

Hey,

I`ve been dealing with this problem for quite some time now. Today I decided to ask you here to what it means or if there is any solution to this problem. I already tried to follow the example but nothing seems to be working for me.

This is the client.ts file:

import "reflect-metadata";
import ApolloClient, { Resolvers, InMemoryCache } from "apollo-boost";
import { buildTypeDefsAndResolvers } from "type-graphql";
import TestResolver from "./TestResolver";

const cache = new InMemoryCache();

export default async function createApolloClient() {
  const { typeDefs, resolvers } = await buildTypeDefsAndResolvers({
    resolvers: [TestResolver],
    skipCheck: true
  });

  const client: ApolloClient<unknown> = new ApolloClient({
    cache,
    typeDefs,
    resolvers: resolvers as Resolvers
  });

  return client;
}

and this is the TestResolver file:

import { gql } from "apollo-boost";
import { ApolloCache } from "apollo-cache";
import { Resolver, Mutation, Ctx } from "type-graphql";

import ApolloContext from "./apollo/context";
import CounterType from "./counter.type";

@Resolver(of => CounterType)
export default class TestResolver {
  @Mutation(returns => Boolean, { nullable: true })
  incrementCounter(@Ctx() { cache }: ApolloContext) {
    TestResolver.updateCounter(cache, value => value + 1);
  }

  @Mutation(returns => Boolean, { nullable: true })
  decrementCounter(@Ctx() { cache }: ApolloContext) {
    TestResolver.updateCounter(cache, value => Math.max(value - 1, 0));
  }

  private static updateCounter(
    cache: ApolloCache<any>,
    getNewValueCb: (value: number) => number
  ) {
    const query = gql`
      query {
        counter @client {
          __typename
          value
        }
      }
    `;
    const { counter } = cache.readQuery<{ counter: CounterType }>({ query })!;
    const data = {
      counter: {
        ...counter,
        value: getNewValueCb(counter.value)
      }
    };
    cache.writeQuery({ query, data });
  }
}

Any help is MUCH appreciated.

[MichalLytek]

Can you paste here the whole error with a stacktrace?

[MichalLytek]

Closing for a housekeeping purposes 🔒

[cstffx]

I have the same error. I'm using this template with the steps in the Getting started section

[MichalLytek]

@cstffx
Can you create a repository with a minimal reproducible code example?
TypeError: The "original" argument must be of type Function tells me nothing about the problem that might be related to tsconfig, setup, bundler or everything 😉

[cstffx]

Yep, here is the complete example.

git clone https://github.com/cstffx/typegraphql-test.git
cd typegraphql-test 
yarn test

The compilation is successful but fails to execute.
Node version: 12.13.1

[MichalLytek]

@cstffx You can't use the babel without providing proper plugins - see #55.

Also, you are trying to bundle node_modules which you can't for Node.js project - TypeGraphQL is not a frontend framework.

[cstffx]

Tell me more about it. I'm excluding node_modules in my tsconfig.json and and in the babel-loader in webpack.config.js.

[MichalLytek]

I mean node native modules like crypto, path, and others 😉

TypeGraphQL doesn't officially support JS nor babel, so I can't help you with configuring webpack. Please ask the community on gitter chat:
https://gitter.im/type-graphql/Lobby

[cstffx]

Thanks for your time. As beginner I discovered that at the end it has not much sense to use babel in the backend. But it is possible and if some one need to do it I left this example

[SaiRS]

I met the same problem when I tried to use type-graphql with web client.
Here is my solution.

Since TypeGraphQL is a Node.js framework, it doesn't work in a browser environment, so we may quickly get an error, e.g. ERROR in ./node_modules/fs.realpath/index.js, while trying to build our app with Webpack. To correct this, we have to configure Webpack to use the decorator shim instead of the normal module. We simply add this plugin code to our webpack config:

  plugins: [
    // ... here are any other existing plugins that we already have
    new webpack.NormalModuleReplacementPlugin(/type-graphql$/, resource => {
      resource.request = resource.request.replace(/type-graphql/, "type-graphql/dist/browser-shim.js");
    }),
  ];

and here is the doc link