angular universal: статический html не импортирует js-файл, полное клиентское приложение не может быть запущено - PullRequest
0 голосов
/ 19 сентября 2019

Я пытаюсь использовать angular universal в моем проекте, и я следую этому руководству: https://angular.io/guide/universal.

при запуске npm run build: ssr && npm run serve: ssr, l получить эту информацию: Node Expressсервер прослушивает http://localhost:4000

, затем я открываю http://localhost:4000, рендеринг html и css успешно выполняется, но браузер не импортирует ts-файл, такой как runtime.js, main.js, polyfills.js.

журнал node.js: сервер прослушивает http://localhost:4000

ERROR [Error]
ERROR [Error]

Ошибка: ошибка NetworkError, никакой другой информации

Приложение загружает localhost / html, только styles.css / css, интерфейс браузера выглядит как статическая страница, без эффекта взаимодействия.

Вот мой package.json:

{
  "name": "lib-passport-web",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "extract": "ngx-translate-extract -m _m --input ./src/app --output ./src/assets/i18n/en.json ./src/assets/i18n/zh_cn.json --clean --sort --format json",
    "compile:server": "webpack --config webpack.server.config.js --progress --colors",
    "serve:ssr": "node dist/server",
    "build:ssr": "npm run build:client-and-server-bundles && npm run compile:server",
    "build:client-and-server-bundles": "ng build --prod && ng run lib-passport-web:server:production"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "~7.2.0",
    "@angular/common": "~7.2.0",
    "@angular/compiler": "~7.2.0",
    "@angular/core": "~7.2.0",
    "@angular/forms": "~7.2.0",
    "@angular/http": "~7.2.0",
    "@angular/platform-browser": "~7.2.0",
    "@angular/platform-browser-dynamic": "~7.2.0",
    "@angular/platform-server": "~7.2.0",
    "@angular/router": "~7.2.0",
    "@nguniversal/express-engine": "7.1.1",
    "@nguniversal/module-map-ngfactory-loader": "0.0.0",
    "@ngx-translate/core": "^11.0.0",
    "@ngx-translate/http-loader": "^4.0.0",
    "@ngxs/store": "^3.0.0",
    "core-js": "^2.5.4",
    "devextreme": "^18.1.3",
    "devextreme-angular": "^18.1.3",
    "devextreme-intl": "^18.1.3",
    "express": "^4.15.2",
    "file-saver": "^2.0.0",
    "lodash-es": "^4.17.10",
    "moment": "^2.20.1",
    "ng-zorro-antd": "~7.3.1",
    "ngx-permissions": "^6.0.1",
    "rxjs": "~6.3.3",
    "sweetalert2": "^8.8.3",
    "tslib": "^1.9.0",
    "zone.js": "~0.8.26"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.13.0",
    "@angular/cli": "~7.3.8",
    "@angular/compiler-cli": "~7.2.0",
    "@angular/language-service": "~7.2.0",
    "@biesbjerg/ngx-translate-extract": "^2.3.4",
    "@ngxs/devtools-plugin": "^3.0.0",
    "@types/file-saver": "^2.0.0",
    "@types/jasmine": "~2.8.8",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "~8.9.4",
    "codelyzer": "~4.5.0",
    "jasmine-core": "~2.99.1",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~4.0.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.1",
    "karma-jasmine": "~1.1.2",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "~5.4.0",
    "ts-loader": "^5.2.0",
    "ts-node": "~7.0.0",
    "tslint": "~5.11.0",
    "typescript": "~3.2.2",
    "webpack-cli": "^3.1.0"
  }
}

html :

<!DOCTYPE html><html lang="en"><head>
  <meta charset="utf-8">
  <title>LibPassportWeb</title>
  <base href="/">

  <meta content="width=device-width, initial-scale=1" name="viewport">
  <link href="favicon.ico" rel="icon" type="image/x-icon">
<link rel="stylesheet" href="styles.a36380f0d6fae50c8428.css"><style ng-transition="serverApp">.tabs-area[_ngcontent-sc0] {
    //css
}
<body ng-version="7.2.15">
    //..html
</body></html>

static html не импортирует файл js.

Большое спасибо за ваше внимание и помощь.

...