title: SSR (Express) Angular 9 - Uncaught ReferenceError: $localize is not defined
body: <p>After having upgrading to Angular 9 i am facing the error : Uncaught ReferenceError: $localize is not defined
  Error: It looks like your application or one of its dependencies is using i18n.
  Angular 9 introduced a global <code>$localize()</code> function that needs to be loaded.
  Please run <code>ng add @angular/localize</code> from the Angular CLI.
  (For non-CLI projects, add <code>import '@angular/localize/init';</code> to your <code>polyfills.ts</code> file.
  For server-side rendering applications add the import to your <code>main.server.ts</code> file.)</p>
  
  <p>My app is SSR (Server Side Rendered) and i cant get ride of this message even after following the guidance. </p>
  
  <ul>
  <li>I serve my files with Express  </li>
  <li>I have put : import
  '@angular/localize/init'; in polyfill.ts </li>
  <li>I also ran ng add
  @angular/localize </li>
  <li>I only have a server.js file for Express and i have
  put also import '@angular/localize/init'; in it.</li>
  </ul>
  
  <p>Here is my angular.json file :</p>
  
  <pre><code>{
    "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
    "version": 1,
    "newProjectRoot": "projects",
    "projects": {
      "tableng": {
        "i18n": {
          "sourceLocale": "en-US",
          "locales": {
            "fr": {
              "translation": "src/translate/messages.fr.xlf",
              "baseHref": "/fr/"
            }
          }
        },
        "root": "",
        "sourceRoot": "src",
        "projectType": "application",
        "prefix": "app",
        "schematics": {},
        "architect": {
          "build": {
            "builder": "@angular-devkit/build-angular:browser",
            "options": {
              "outputPath": "dist/tableng",
              "index": "src/index.html",
              "main": "src/main.ts",
              "polyfills": "src/polyfills.ts",
              "tsConfig": "src/tsconfig.app.json",
              "assets": [
                "src/favicon.ico",
                "src/assets",
                "src/web.config",
                "src/manifest.json"
              ],
              "styles": [
                "node_modules/jquery/dist/jquery.min.js",
                "node_modules/bootstrap/dist/css/bootstrap.min.css",
                "node_modules/font-awesome/css/font-awesome.css",
                "node_modules/@fullcalendar/core/main.css",
                "node_modules/@fullcalendar/resource-timeline/main.css",
                "node_modules/@fullcalendar/timegrid/main.css",
                "node_modules/@fullcalendar/timeline/main.css",
                "src/assets/sb-admin-2.min.css",
                "src/styles.css",
                "src/morestyles.scss"
              ],
              "scripts": [
                "node_modules/jquery/dist/jquery.min.js",
                "node_modules/jquery/dist/jquery.js",
                "node_modules/popper.js/dist/umd/popper.min.js",
                "node_modules/bootstrap/dist/js/bootstrap.min.js"
  
              ]
            },
            "configurations": {
              "fr": {
                "localize": ["fr"]
              },
              "production": {
                "fileReplacements": [
                  {
                    "replace": "src/environments/environment.ts",
                    "with": "src/environments/environment.prod.ts"
                  }
                ],
                "optimization": true,
                "outputHashing": "all",
                "sourceMap": false,
                "extractCss": true,
                "namedChunks": false,
                "aot": true,
                "extractLicenses": true,
                "vendorChunk": false,
                "buildOptimizer": true,
                "budgets": [
                  {
                    "type": "initial",
                    "maximumWarning": "2mb",
                    "maximumError": "5mb"
                  }
                ],
                "serviceWorker": true,
                "ngswConfigPath": "src/ngsw-config.json"
              }
            }
          },
          "serve": {
            "builder": "@angular-devkit/build-angular:dev-server",
            "options": {
              "browserTarget": "tableng:build"
            },
            "configurations": {
              "fr": {
                "browserTarget": "tableng:build:fr"
              },
              "production": {
                "serve:dist": "http-server -p 8080 -c-1 dist/tableng",
                "browserTarget": "ng build --prod --localize --build-optimizer"
              }
            }
          }
        }
      }
  
    }}
  </code></pre>
  
  <p>and my server.js file : </p>
  
  <pre><code>'use strict';
  const bodyParser = require('body-parser');
  const $localize = require('@angular/localize');
  
  var express = require('express');
  var app = express();
  var directory = '/' + (process.env.STATIC_DIR)
  
  app.use(express.static(__dirname + directory));
  app.use('/fr',function(req, res) {
     res.sendFile(__dirname + '/dist/tableng/fr/index.html');
  
  }); 
  
  app.use('/',function(req, res) {
    res.sendFile(__dirname + '/dist/tableng/en-US/index.html'); 
  }); 
  
  app.use(express.json());       // to support JSON-encoded bodies
  app.use(express.urlencoded({ extended: true})); // to support URL-encoded bodies
  
  var port = process.env.PORT || 3000;
  app.listen(port, function () {
    console.log('express - Listening on', port);
  
  });
  </code></pre>
  
  <p>Thanks for any inputs !!</p>