Angular 5 应用程序无法在 Firefox v48.0.1 或 < 50.0 中运行

Question

由于项目范围的原因，我正在尝试在旧版本的浏览器中运行我的 Angular 应用程序。应用程序在最新版本和 Chrome 中运行良好。问题似乎出在 IE10 和 Mozilla Firefox(Firefox 版本 < 50)上。我当前正在使用 48.0.1 运行我的应用程序，并且我在控制台中遇到简单的一行问题，内容如下。

类型错误:这是未定义的就是这样。

我尝试用 google 搜索，发现了一个类似的 git hub 问题。

这是我找到的关闭解决方案。 https://github.com/angular/angular-cli/issues/9340

我尝试按照问题与 uglifyjs-webpack-plugin 相关的步骤进行操作，并将其移至之前的版本 1.1.5。我也用这些命令尝试过。

npm i uglifyjs-webpack-plugin@1.1.5 --save-exact
rm -rf package-lock.json node_modules
npm install

现在的问题是我仍然可以在我的 package-lock.json 文件中看到一些其他版本 1.2.5 和 0.4.6。我手动删除了，但还是没有解决。

package.json

"dependencies": {
    ...
    "uglifyjs-webpack-plugin": "1.1.5",
}

package-lock.json

"@angular/cli": {

    "dependencies": {

        "requires": {
            ...
            "uglifyjs-webpack-plugin": "1.2.5",
        }
        "uglifyjs-webpack-plugin": {
          "version": "1.2.5",
          "resolved": "https://registry.npmjs.org/uglifyjs-webpack-plugin/-/uglifyjs-webpack-plugin-1.2.5.tgz",
          "integrity": "sha512-hIQJ1yxAPhEA2yW/i7Fr+SXZVMp+VEI3d42RTHBgQd2yhp/1UdBcR3QEWPV5ahBxlqQDMEMTuTEvDHSFINfwSw==",
          "dev": true,
          "requires": {
            "cacache": "10.0.4",
            "find-cache-dir": "1.0.0",
            "schema-utils": "0.4.5",
            "serialize-javascript": "1.5.0",
            "source-map": "0.6.1",
            "uglify-es": "3.3.9",
            "webpack-sources": "1.1.0",
            "worker-farm": "1.6.0"
          },
          "dependencies": {
            "source-map": {
              "version": "0.6.1",
              "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
              "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
              "dev": true
            }
          }
        }

        ....

        "uglifyjs-webpack-plugin": {
          "version": "1.1.5",
          "resolved": "https://registry.npmjs.org/uglifyjs-webpack-plugin/-/uglifyjs-webpack-plugin-1.1.5.tgz",
          "integrity": "sha512-YBGc9G7dv12Vjx8vUQs54DZgAXVf04LlG6dNNiEbTZjL3PbUqiY4uPB9Kv+fUJaqRskEGva/lS7sh08yJr7jnA==",
          "requires": {
            "cacache": "10.0.4",
            "find-cache-dir": "1.0.0",
            "schema-utils": "0.3.0",
            "serialize-javascript": "1.5.0",
            "source-map": "0.6.1",
            "uglify-es": "3.2.2",
            "webpack-sources": "1.1.0",
            "worker-farm": "1.6.0"
          }
        },

        "webpack": {
            "requires": {
                "uglifyjs-webpack-plugin": "0.4.6",
            }
            "dependencies": {
                "uglifyjs-webpack-plugin": {
                  "version": "0.4.6",
                  "resolved": "https://registry.npmjs.org/uglifyjs-webpack-plugin/-/uglifyjs-webpack-plugin-0.4.6.tgz",
                  "integrity": "sha1-uVH0q7a9YX5m9j64kUmOORdj4wk=",
                  "dev": true,
                  "requires": {
                    "source-map": "0.5.7",
                    "uglify-js": "2.8.29",
                    "webpack-sources": "1.1.0"
                  }
                },
            }
        }

    }
}

我能得到的任何想法或帮助。这对于项目来说至关重要。

提前致谢。

Answer 1

我找到了一个可用的解决方法。

只需添加 --aot false 即可。

我正在使用命令ngserve --prod --aot=false，它的工作原理就像魅力。

但是是否知道它是否安全？我发现 github 上有同样的讨论。

https://github.com/angular/angular-cli/issues/9244

https://github.com/angular/angular/issues/21631

强烈建议对此问题或正确答案进行任何更新。

谢谢