1

我在旧应用程序中更新了 Angular（从 7 到 11），一切都很好，除了一件事 :)。首先，让我说我不是 Angular 方面的专家。

执行命令后ng build --prod，我得到：

Schema validation failed with the following errors:
  Data path "" should NOT have additional properties(terserOptions).

我在 Angular.json 中进行了更改

"production": {
  "optimization": true,
  "outputHashing": "all",
  "sourceMap": false,
  "extractCss": true,
  "namedChunks": false,
  "aot": true,
  "extractLicenses": true,
  "vendorChunk": false,
  "buildOptimizer": true,
  "fileReplacements": [
    {
      "replace": "src/environments/environment.ts",
      "with": "src/environments/environment.prod.ts"
    }
  ],
  "terserOptions": {
    "keep_classnames": ".*Component",
    "keep_fnames": ".*Component"
  }

至

"production": {
  "customWebpackConfig": {
    "path": "./webpack.config.js"
  },
  "optimization": true,
  "outputHashing": "all",
  "sourceMap": false,
  "namedChunks": false,
  "aot": true,
  "extractLicenses": true,
  "vendorChunk": false,
  "buildOptimizer": true,
  "fileReplacements": [
    {
      "replace": "src/environments/environment.ts",
      "with": "src/environments/environment.prod.ts"
    }

我补充说webpack.config.js：

const TerserPlugin = require("terser-webpack-plugin");

module.exports = {
    optimization: {
        minimize: true,
        minimizer: [
            new TerserPlugin({
                terserOptions: {
                    keep_classnames: ".*Component",
                    keep_fnames: ".*Component",
                },
            }),
        ],
    },
};

好的，prod 正在构建，但应用程序仍然无法正常运行。我一次不能打开多个窗口... Terser 用于避免缩短组件名称，在构建产品时最小化代码时，因为这些名称用于处理窗口。我究竟做错了什么？或者我应该使用其他方式来保留这些组件名称？

我还附上package.json：

{
  "name": "app",
  "version": "0.0.0",
  "license": "MIT",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build --prod",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^11.1.2",
    "@angular/cdk": "^11.1.1",
    "@angular/common": "^11.1.2",
    "@angular/compiler": "^11.1.2",
    "@angular/core": "^11.1.2",
    "@angular/flex-layout": "^11.0.0-beta.33",
    "@angular/forms": "^11.1.2",
    "@angular/material": "^11.1.1",
    "@angular/platform-browser": "^11.1.2",
    "@angular/platform-browser-dynamic": "^11.1.2",
    "@angular/platform-server": "^11.1.2",
    "@angular/router": "^11.1.2",
    "@asymmetrik/ngx-leaflet": "^8.1.0",
    "@ngtools/webpack": "^11.1.2",
    "@types/node": "^14.14.25",
    "angular-resizable-element": "^3.3.5",
    "angular2-draggable": "1.4.2",
    "circular-json": "^0.5.4",
    "core-js": "^3.8.3",
    "hammerjs": "^2.0.8",
    "jquery": "^3.5.1",
    "keycloak-angular": "^8.1.0",
    "keycloak-js": "^12.0.2",
    "leaflet": "^1.7.1",
    "lodash": "^4.17.20",
    "ng2-dragula": "^1.5.0",
    "rxjs": "^6.6.3",
    "ts-md5": "^1.2.7",
    "typings": "^2.1.1",
    "zone.js": "^0.11.3"
  },
  "devDependencies": {
    "@angular-builders/custom-webpack": "^11.0.0",
    "@angular-devkit/architect": "^0.1101.1",
    "@angular-devkit/build-angular": "^0.1101.1",
    "@angular-eslint/builder": "^1.1.0",
    "@angular-eslint/eslint-plugin": "1.1.0",
    "@angular-eslint/eslint-plugin-template": "1.1.0",
    "@angular-eslint/schematics": "1.1.0",
    "@angular-eslint/template-parser": "1.1.0",
    "@angular/cli": "^11.1.2",
    "@angular/compiler-cli": "^11.1.2",
    "@angular/language-service": "^11.1.2",
    "@types/jasmine": "^3.6.3",
    "@types/jasminewd2": "~2.0.8",
    "@types/leaflet": "^1.5.21",
    "@typescript-eslint/eslint-plugin": "4.14.2",
    "@typescript-eslint/parser": "4.14.2",
    "eslint": "^7.19.0",
    "eslint-plugin-import": "2.22.1",
    "eslint-plugin-jsdoc": "31.6.0",
    "eslint-plugin-prefer-arrow": "1.2.3",
    "jasmine-core": "~3.6.0",
    "jasmine-spec-reporter": "~6.0.0",
    "karma": "^6.1.0",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage-istanbul-reporter": "^3.0.3",
    "karma-jasmine": "^4.0.1",
    "karma-jasmine-html-reporter": "^1.5.4",
    "protractor": "^7.0.0",
    "terser-webpack-plugin": "^4.2.3",
    "ts-node": "~9.1.1",
    "typescript": "^4.1.3",
    "webpack": "^4.0.0"
  }
}
4

0 回答 0