Skn0tt / nextjs-nestjs-integration-example

https://nextjs-nestjs-integration-example.now.sh
156 stars 36 forks source link

Cannot get dependency injection to work #3

Closed gendronb closed 4 years ago

gendronb commented 4 years ago

Hi Simon,

Thanks for sharing this code, great work.

However, I tried to add an injectable service to your example, without any success. The injected instance is always undefined.

I wonder if this has to do with Next.js compiler options?

gendronb commented 4 years ago

I forked your repo and created an example that illustrates the problem: https://github.com/gendronb/nextjs-nestjs-integration-example

You can start the NestJS backend by itself by typing nest start, and test the /api/randomNumber, this works OK.

However, using the same backend as a NextJS api "catch-all" route (npm run dev) results in an exception:

[Nest] 13820   - 2020-05-29 12 h 30 min 50 s   [ExceptionsHandler] Cannot read property 'createRandomNumber' of undefined +42ms
TypeError: Cannot read property 'createRandomNumber' of undefined
    at AppController.randomNumber (C:\Data\dev\01-experiments\nextjs-nestjs-integration-example-v2\.next\server\static\vsw7BEtLhMTMi5vfucAHK\pages\api\[...catchAll].js:139:28)
    at C:\Data\dev\01-experiments\nextjs-nestjs-integration-example-v2\node_modules\@nestjs\core\router\router-execution-context.js:37:29
    at InterceptorsConsumer.intercept (C:\Data\dev\01-experiments\nextjs-nestjs-integration-example-v2\node_modules\@nestjs\core\interceptors\interceptors-consumer.js:10:20)
    at C:\Data\dev\01-experiments\nextjs-nestjs-integration-example-v2\node_modules\@nestjs\core\router\router-execution-context.js:45:60
    at C:\Data\dev\01-experiments\nextjs-nestjs-integration-example-v2\node_modules\@nestjs\core\router\router-proxy.js:8:23
    at Layer.handle [as handle_request] (C:\Data\dev\01-experiments\nextjs-nestjs-integration-example-v2\node_modules\express\lib\router\layer.js:95:5)
    at next (C:\Data\dev\01-experiments\nextjs-nestjs-integration-example-v2\node_modules\express\lib\router\route.js:137:13)
    at Route.dispatch (C:\Data\dev\01-experiments\nextjs-nestjs-integration-example-v2\node_modules\express\lib\router\route.js:112:3)
    at Layer.handle [as handle_request] (C:\Data\dev\01-experiments\nextjs-nestjs-integration-example-v2\node_modules\express\lib\router\layer.js:95:5)
    at C:\Data\dev\01-experiments\nextjs-nestjs-integration-example-v2\node_modules\express\lib\router\index.js:281:22
Skn0tt commented 4 years ago

Hi gendronb,

Happy the code and blog post are helpful to you :)

To make it work, you'll need to explicitly inject the Service as in the following:

import { Inject, Controller } from "@nestjs/common";
import { AppService } from './app.service'

@Controller("randomNumber")
export class AppController {

  constructor(
    @Inject(AppService) // <-- explicitly inject
    private appService: AppService) {}
  // ...
}

This is not specifc to Nest.js, I also had to do this in a plain TS project before.