javascript - Hvordan bruke EJS-malingsmotor med NestJS?


Jeg vil gjerne bruke EJS som malmotor i NestJS. Med Express kan jeg konfigurere EJS i hovedfilen på denne måten:

app.set("view engine", "ejs");

Hvordan kan jeg best implementere dette med NestJS? NestJS leveres ikke med en .set-metode.

Svar #1

Du kan konfigurere det med hjelp av app.setViewEngine('ejs') i main.ts. Først, installer det:

npm i ejs

Med linjene nedenfor ville du ha fortalt Express at public-katalogen vil bli brukt til å lagre statiske ressurser, views vil inneholde maler, og at ejs-malmotoren skal brukes for å gjengi HTML-utdata.

// main.ts
import { NestFactory } from '@nestjs/core';
import { NestExpressApplication } from '@nestjs/platform-express';
import { join } from 'path';
import { AppModule } from './app.module';

async function bootstrap() {
  const app = await NestFactory.create<NestExpressApplication>(
    AppModule,
  );
  /*
     Here it's assumed that public and views are in the root directory,
     alongside src. You can put them wherever you want, 
     just use the correct path if you use another folder.
  */
  app.useStaticAssets(join(__dirname, '..', 'public'));
  app.setBaseViewsDir(join(__dirname, '..', 'views'));
  app.setViewEngine('ejs');

  await app.listen(3000);
}
bootstrap();

Og nedenfor er hvordan du vil gjengi en mal i en Controller. Du gjengir index.ejs og sender message som en parameter.

// app.controller.ts
import { Get, Controller, Render } from '@nestjs/common';

@Controller()
export class AppController {
  @Get()
  @Render('index')
  root() {
    return { message: 'Hello world!' };
  }
}

Til slutt vil du bruke den overførte message-variabelen inne i index.ejs slik:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>App</title>
  </head>
  <body>
    <%= message %>
  </body>
</html>

Du kan lese mer i den offisielle dokumentasjonen.

Relaterte artikler