Angular-cli (7.3.8), производственная среда, как написать скомпилированный runtime.js непосредственно в HTML вместо ссылки js? - PullRequest
0 голосов
/ 26 апреля 2019

"@ angular / cli": "~ 7.3.8", angular7.2, настройки по умолчанию для последней версии.

Файл runtime.js, сгенерированный после упаковки, слишком мал, я хочу записать его непосредственно в html-файл, сохранив один запрос ресурса.

Поскольку angular-cli не может напрямую настроить конфигурацию веб-пакета, после просмотра информации: я решил использовать «ngx-build-plus», дополнительно написал ссылку на конфигурацию веб-пакета, а затем использовал плагин: «InlineManifestWebpackPlugin»

package.json:

"scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build --prod --extraWebpackConfig"
  },
"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/platform-browser": "~7.2.0",
    "@angular/platform-browser-dynamic": "~7.2.0",
    "@angular/pwa": "^0.12.4",
    "@angular/router": "~7.2.0",
    "@angular/service-worker": "~7.2.0",
    "@ngx-translate/core": "^11.0.1",
    "@ngx-translate/http-loader": "^4.0.0",
    "core-js": "^2.5.4",
    "ng-lazyload-image": "^5.1.2",
    "ngx-build-plus": "^7.8.1",
    "ngx-infinite-scroll": "^7.1.0",
    "rxjs": "~6.3.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",
    "@types/jasmine": "~2.8.8",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "~8.9.4",
    "codelyzer": "~4.5.0",
    "copy-webpack-plugin": "^5.0.2",
    "html-webpack-inline-source-plugin": "0.0.10",
    "html-webpack-plugin": "^4.0.0-beta.5",
    "inline-manifest-webpack-plugin": "^4.0.2",
    "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-node": "~7.0.0",
    "tslint": "~5.11.0",
    "typescript": "~3.2.2",
    "webpack-bundle-analyzer": "^3.3.2",
    "webpack-cdn-plugin": "^3.0.0"
  }

angular.json

....
"architect": {
    "build": {
      "builder": "ngx-build-plus:build",
      ....

webpack.extra.js

const HtmlWebpackPlugin = require('html-webpack-plugin');
const InlineManifestWebpackPlugin = require('inline-manifest-webpack-plugin')
module.exports = {
  plugins:[
    new HtmlWebpackPlugin(),
    new InlineManifestWebpackPlugin()
  ]
}

Но результатом является ошибка упаковки, возможная причина в том, что angular-cli использует webpack4.0 +, а html-webpack-plugin - версия 3.2. Но даже если я использую html-webpack-plugin @ next version, я все равно получаю сообщение об ошибке:

TypeError: Cannot read property 'tapAsync' of undefined.

У меня что-то не так? Или есть лучший способ написать "runtime.js" в HTML вместо создания ссылки?

0.o

Спасибо ~

...