CODEWITHSUNDEEP
typescriptnuxt.js
pirmax
pirmax

Reputation: 2153

NestJS + NuxtJS (in TypeScript)

I am currently looking for someone who has already prepared a starter kit with NestJS (back side) & NuxtJS (front side) with SSR (server side rendering), in TypeScript.

I would like to learn these two techno but I have not found enough help to build a project from scratch with them.

What interests me about Nuxt is this ease of creating pages, and for Nest, it’s pretty complete and easy to create APIs too.

I found some repositories on Github for quite a bit of old stuff and package updates make everything jump.

I created my proper project: https://github.com/pirmax/nuxt-and-nest But, either the API routes run on https://localhost:3000/api, or the Nuxt routes work if I remove the NuxtJS integration.

async function bootstrap() {
  const nuxt = await new Nuxt(config);
  config.dev = !(process.env.NODE_ENV === "production");
  if (config.dev) {
    await new Builder(nuxt).build();
  }
  const app = await NestFactory.create(AppModule);
  await app.setGlobalPrefix("api");
  await app.listen(3000, () => console.log("Application is listening on port 3000."));
  await app.use(nuxt.render);
}

bootstrap();

Now, I have this error:

bundle export should be a function when using { runInNewContext: false }.

And if refresh page:

runner is not a function

Upvotes: 1

Views: 3084

Answers (2)

STEN
STEN

Reputation: 443

If you use nest as a connect middleware you can combine nest with nuxt through the servermiddleware nuxt config option. Maybe this gist can give you a rough idea: https://gist.github.com/1isten/ed286c3980523f4a4f9b6b627f540091

Upvotes: 0

Adrian Luong
Adrian Luong

Reputation: 26

Maybe this will help:

import { NestFactory } from '@nestjs/core';
import { ServerModule } from './server.module';

const { Nuxt, Builder } = require('nuxt');
const config = require('../nuxt.config.js');
config.dev = process.env.NODE_ENV !== 'production';

async function bootstrap() {
     const app = await NestFactory.create(ServerModule);
     const nuxt = new Nuxt(config);
     const { host, port } = nuxt.options.server;

     if (config.dev) {
         const builder = new Builder(nuxt);
         await builder.build();
     } else {await nuxt.ready();}

     app.use(nuxt.render);

     await app.listen(port, host);
}
bootstrap();

Upvotes: 1

Related Questions