Angular Universal 与 i18n（服务器端渲染）

# Angular Universal 与 i18n：实现服务器端渲染的多语言Web应用

bash
ng add @nguniversal/express-engine

bash
npm run build:ssr
npm run serve:ssr

bash
ng add @angular/localize

typescript
// server.ts
import 'zone.js/node';
import 'reflect-metadata';
import { enableProdMode } from '@angular/core';
import { ngExpressEngine } from '@nguniversal/express-engine';
import * as express from 'express';
import { join } from 'path';
// Import translations
import { translations } from './src/translations';
// Import your Angular Universal app
import { AppServerModule } from './src/main.server';
import { APP_BASE_HREF } from '@angular/common';
// Enable production mode
enableProdMode();
// Create an Express application
const app = express();
// Define the port to listen on
const PORT = process.env.PORT || 4000;
// Set the Angular app base href
app.use((req, res, next) => {
  res.render('index', { req, providers: [{ provide: APP_BASE_HREF, useValue: req.baseUrl }] });
});
// Define the static directory to serve
app.use(express.static(__dirname + '/dist/browser'));
// Configure Angular Universal to use the translations
app.engine(
  'html',
  ngExpressEngine({
    bootstrap: AppServerModule,
    providers: [{ provide: 'translate', useValue: translations }],
  })
);
// Set the views directory
app.set('views', join(__dirname, '/dist/browser'));
// Set the view engine
app.set('view engine', 'html');
// Start the server
app.listen(PORT, () => {
  console.log(`Node server listening on http://localhost:${PORT}`);
});