Angular Универсальный сгенерированный тег скрипта в результате - PullRequest
0 голосов
/ 01 августа 2020

при запуске универсального приложения angular. весь серверный текст HTML отображается в теге скрипта. Вы можете проверить https://samir.rmexch.com/m/H1J6aHH3z/uRBPNnADy. когда вы открываете исходный код страницы, вы видите, что тег скрипта был сгенерирован. Мне нужна помощь, чтобы удалить это. Как получить обычный текст HTML без тега скрипта?

// server.ts

import 'zone.js/dist/zone-node';
import { enableProdMode } from '@angular/core';

// Express Engine
// Import module map for lazy loading

import * as express from 'express';
import { join } from 'path';
import { APP_BASE_HREF } from '@angular/common';
import { readFileSync } from 'fs';
import { renderModuleFactory } from '@angular/platform-server';
import 'reflect-metadata';

// Faster server renders w/ Prod mode (dev mode never needed)
enableProdMode();

// Express server
const app = express();

const PORT = process.env.PORT || 8080;
const DIST_FOLDER = join(process.cwd(), 'dist');
const SERVER_FOLDER = join(DIST_FOLDER, 'server');
const BROWSER_FOLDER = join(DIST_FOLDER, 'v2' , 'browser');
const template = readFileSync(join(BROWSER_FOLDER, 'index.html')).toString();
// * NOTE :: leave this as require() since this file is built Dynamically from webpack
const { AppServerModuleNgFactory, LAZY_MODULE_MAP, ngExpressEngine, provideModuleMap } = require( SERVER_FOLDER + '/main');

// Our Universal express-engine (found @ https://github.com/angular/universal/tree/master/modules/express-engine)
app.engine('html', ngExpressEngine({
  bootstrap: AppServerModuleNgFactory,
  providers: [
    provideModuleMap(LAZY_MODULE_MAP)
  ]
}));


app.set('view engine', 'html');
app.set('views', BROWSER_FOLDER);

// Example Express Rest API endpoints
// app.get('/api/**', (req, res) => { });

// Server static files from /browser

app.use('/v2', express.static(BROWSER_FOLDER, { index: false }));

// All regular routes use the Universal engine
app.get('*', (req, res) => {
  res.render(join(BROWSER_FOLDER, 'index.html'), { req });
});


app.listen(PORT, () => {
  console.log('Server started! http://localhost:' + PORT);
});
// app.server.module.ts
import { ServerModule, ServerTransferStateModule } from '@angular/platform-server';
import { NgModule } from '@angular/core';
import {ModuleMapLoaderModule} from '@nguniversal/module-map-ngfactory-loader';
import { AppModule } from './app.module';
import { AppRoutingModule } from './app-routing.module';

import { AppComponent } from './app.component';


@NgModule({
    imports: [
        AppModule,
        ServerModule,
        ModuleMapLoaderModule,
        ServerTransferStateModule
    ],
    bootstrap: [AppComponent]
})
export class AppServerModule { }
// main.server.ts
export {ngExpressEngine} from '@nguniversal/express-engine';
export {provideModuleMap} from '@nguniversal/module-map-ngfactory-loader';

export {AppServerModule} from './app/app.server.module';
export {LazyModule} from './app/lazy/lazy.module';
// angular.json
{
    "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
    "version": 1,
    "newProjectRoot": "projects",
    "projects": {
      "rmexch-project": {
        "projectType": "application",
        "schematics": {},
        "root": "",
        "sourceRoot": "src",
        "prefix": "app",
        "architect": {
          "build": {
            "builder": "@angular-devkit/build-angular:browser",
            "options": {
              "outputPath": "dist/v2/browser",
              "index": "src/index.html",
              "main": "src/main.ts",
              "polyfills": "src/polyfills.ts",
              "tsConfig": "src/tsconfig.app.json",
              "assets": [
                "src/favicon.ico",
                "src/favicon.png",
                "src/assets"
              ],
              "styles": [
                "./node_modules/video.js/dist/video-js.min.css",
                "./node_modules/@videojs/themes/dist/city/index.css",
                "./node_modules/@videojs/themes/dist/sea/index.css",
                "./node_modules/bootstrap/dist/css/bootstrap.min.css",
                "src/swiper.min.css",
                "src/styles.css"
            ],
              "scripts": []
            },
            "configurations": {
              "production": {
                "fileReplacements": [
                  {
                    "replace": "src/environments/environment.ts",
                    "with": "src/environments/environment.prod.ts"
                  }
                ],
                "optimization": true,
                "sourceMap": false,
                "extractCss": true,
                "namedChunks": false,
                "aot": true,
                "extractLicenses": true,
                "vendorChunk": false,
                "buildOptimizer": true,
                "budgets": [
                  {
                    "type": "initial",
                    "maximumWarning": "2mb",
                    "maximumError": "5mb"
                  },
                  {
                    "type": "anyComponentStyle",
                    "maximumWarning": "6kb",
                    "maximumError": "10kb"
                  }
                ]
              }
            }
          },
          "serve": {
            "builder": "@angular-devkit/build-angular:dev-server",
            "options": {
              "browserTarget": "rmexch-project:build"
            },
            "configurations": {
              "production": {
                "browserTarget": "rmexch-project:build:production"
              }
            }
          },
          "extract-i18n": {
            "builder": "@angular-devkit/build-angular:extract-i18n",
            "options": {
              "browserTarget": "rmexch-project:build"
            }
          },
          "test": {
            "builder": "@angular-devkit/build-angular:karma",
            "options": {
              "main": "src/test.ts",
              "polyfills": "src/polyfills.ts",
              "tsConfig": "tsconfig.spec.json",
              "karmaConfig": "karma.conf.js",
              "assets": [
                "src/favicon.ico",
                "src/assets"
              ],
              "styles": [
                "src/styles.css"
              ],
              "scripts": []
            }
          },
          "lint": {
            "builder": "@angular-devkit/build-angular:tslint",
            "options": {
              "tsConfig": [
                "tsconfig.app.json",
                "tsconfig.spec.json",
                "e2e/tsconfig.json"
              ],
              "exclude": [
                "**/node_modules/**"
              ]
            }
          },
          "e2e": {
            "builder": "@angular-devkit/build-angular:protractor",
            "options": {
              "protractorConfig": "e2e/protractor.conf.js",
              "devServerTarget": "rmexch-project:serve"
            },
            "configurations": {
              "production": {
                "devServerTarget": "rmexch-project:serve:production"
              }
            }
          },
          "server": {
            "builder": "@angular-devkit/build-angular:server",
            "options": {
              "outputPath": "dist/server",
              "main": "src/main.server.ts",
              "tsConfig": "src/tsconfig.server.json"
            },
            "configurations": {
              "production": {
                "fileReplacements": [
                  {
                    "replace": "src/environments/environment.ts",
                    "with": "src/environments/environment.prod.ts"
                  }
                ],
                "sourceMap": false,
                "optimization": true
              }
            }
          },
          "serve-ssr": {
            "builder": "@nguniversal/builders:ssr-dev-server",
            "options": {
              "browserTarget": "rmexch-project:build",
              "serverTarget": "rmexch-project:server"
            },
            "configurations": {
              "production": {
                "browserTarget": "rmexch-project:build:production",
                "serverTarget": "rmexch-project:server:production"
              }
            }
          },
          "prerender": {
            "builder": "@nguniversal/builders:prerender",
            "options": {
              "browserTarget": "rmexch-project:build:production",
              "serverTarget": "rmexch-project:server:production",
              "routes": [
                "/"
              ]
            },
            "configurations": {
              "production": {}
            }
          }
        }
      }
    },
    "cli": {},
    "schematics": {
      "@schematics/angular:class": {
        "spec": false
      },
      "@schematics/angular:component": {
        "spec": false,
        "inlineStyle": true,
        "inlineTemplate": true,
        "prefix": "app",
        "styleext": "css"
      },
      "@schematics/angular:directive": {
        "spec": false,
        "prefix": "app"
      },
      "@schematics/angular:guard": {
        "spec": false
      },
      "@schematics/angular:module": {
        "spec": false
      },
      "@schematics/angular:pipe": {
        "spec": false
      },
      "@schematics/angular:service": {
        "spec": false
      }
    },
    "defaultProject": "rmexch-project"
  }
  
...