CODEWITHSUNDEEP
typescriptgraphqlnestjs
shankar
shankar

Reputation: 233

Nest.js Graphql Nested InputType throws reference error

Using the Code First approach with Nest.js graphql I am trying to create a mutation where there is nested Input Type. The server throws the below error

__metadata("design:type", MenuInput)
                              ^
ReferenceError: Cannot access 'MenuInput' before initialization
at Object.<anonymous> (.../dist/order.input.js:26:31)

The dist file looks like below

__decorate([
    graphql_1.Field(_type => MenuInput, { nullable: true }),
    __metadata("design:type", MenuInput)
], OrderInput.prototype, "menu", void 0);

The Input Classes Looks Like Below

import { Field, InputType, Int } from '@nestjs/graphql';

@InputType()
export class OrderInput {
  @Field()
  orderName: string;

  @Field(_type => MenuInput)
  menu: MenuInput;
}

@InputType()
class MenuInput {
  @Field()
  id: string;
}

Resolver

In the resolver I expect an array of OrderInputs

  @Mutation(_returns => OrderModel)
  async createOrder(
    @Args('newOrderData', { type: () => [OrderInput] })
    newOrderData: OrderInput[],
  ): Promise<OrderModel[]> {
    return this.orderService.createOrder(newOrderData);
  }

What have I tried so far:

Tried to set { nullable: true } on the Field (no luck).

Not really sure what is causing this issue.

Package.json

  "dependencies": {
    "@nestjs/common": "^7.5.1",
    "@nestjs/core": "^7.5.1",
    "@nestjs/graphql": "^7.9.5",
    "@nestjs/platform-express": "^7.5.1",
    "apollo-server-express": "^2.19.2",
    "graphql": "^15.4.0",
    "graphql-tools": "^7.0.2",
    "reflect-metadata": "^0.1.13",
    "rimraf": "^3.0.2",
    "rxjs": "^6.6.3"
  },
  "devDependencies": {
    "@nestjs/cli": "^7.5.1",
    "@nestjs/schematics": "^7.1.3",
    "@nestjs/testing": "^7.5.1",
    "@types/express": "^4.17.8",
    "@types/jest": "^26.0.15",
    "@types/node": "^14.14.6",
    "@types/supertest": "^2.0.10",
    "@typescript-eslint/eslint-plugin": "^4.6.1",
    "@typescript-eslint/parser": "^4.6.1",
    "eslint": "^7.12.1",
    "eslint-config-prettier": "7.1.0",
    "eslint-plugin-prettier": "^3.1.4",
    "jest": "^26.6.3",
    "prettier": "^2.1.2",
    "supertest": "^6.0.0",
    "ts-jest": "^26.4.3",
    "ts-loader": "^8.0.8",
    "ts-node": "^9.0.0",
    "tsconfig-paths": "^3.9.0",
    "typescript": "^4.0.5"

Can't we have nested InputType or is this a bug? Any help is much appreciated.

Upvotes: 1

Views: 3031

Answers (1)

Jay McDoniel
Jay McDoniel

Reputation: 70540

This is part of how typescript and its decorators work. You're defining a class after you're using it's value. Either move the class up in the file, or move it to its own file.

Upvotes: 1

Related Questions