0

我刚刚从 Angular 4.3.3 升级到 Angular 5.2.1。现在,当我在 dev (ng build --dev) 中构建时,项目构建得很好。但是当在 prod (ng build --prod) 中构建并且应用程序在控制台中加载时,我得到“Uncaught ReferenceError:define is not defined”。我已经验证我已经更新了我项目中的所有折旧语法。

有没有其他人有其他想法。

我正在使用名为 Wijmo 的第三方软件包,但我已经将其更新到他们最新的稳定版本。

4

1 回答 1

1

请在这里找到答案:

在我用 CommonJS 模块(来自 NpmImages\wijmo-commonjs-min 文件夹)替换 Wijmo AMD 模块(来自 NpmImages\wijmo-amd-min 文件夹)后,构建开始为我工作。这看起来与 Wijmo AMD 无关,详情如下。

以下是调查的详细情况。问题是由构建优化器进程引起的,由“--build-optimizer”标志控制,对于使用 Angular 5 的“-prod”构建默认为 true(对于 Angular 4 为 false)。

如果使用NpmImages\wijmo-amd-src 文件夹中的非缩小Wijmo AMD 模块,构建工作没有问题。

我检查了缩小的 wijmo.js 模块,它绝对正确(详情如下),这意味着 Build Optimizer 只包含一个错误,它不允许它正确解析缩小的 AMD 模块。

以下是有关如何从 wijmo.js 模块导出 CollectionView 类的一些详细信息。

A. 未缩小的 wijmo.js:A.1) 这是 AMD 的“定义”函数声明:

define(["require", "exports", "wijmo/wijmo"], function (require, exports, wjcSelf) {

A.2) 这是 CollectionView 类定义的开始:

var CollectionView = (function () {
    function CollectionView(sourceCollection, options) {
        var _this = this;
        this._idx = -1;
        this._srtDsc = new ObservableArray();
        this._grpDesc = new ObservableArray();

A.3) 这里CollectionView导出语句:exports.CollectionView = CollectionView;

请注意,它使用 'exports' 参数传递给 #1(粗体)中的 'define' 回调函数。

B. 现在让我们看看这些东西在缩小的 wijmo.js 模块中的样子:B.1) AMD 定义:

define(["require","exports","wijmo/wijmo"],function(t,e,n)

请注意,A.1 中的“exports”参数已重命名为“e”。B.2) CollectionView 类定义的开始:

Mt=function(){function t(t,e){var n=this;this._idx=-1,this._srtDsc=new xt,this._grpDesc=new xt,

A.1 中的“var CollectionView”在此处重命名为 Mt。B.3) 出口声明

e.CollectionView=Mt;

'e' 是来自 B.1 的 'define' 回调函数的 'e' 参数,它是来自 A.1 的 'export' 参数的缩小版本。

即缩小的 wijmo.js 模块绝对正确地导出 CollectionView,似乎问题出在构建优化器中。我们在这里无能为力。所以解决方法可能是使用非缩小的 Wijmo AMD 模块。但正如我之前所说的——正确的方法是使用 CommonJS 格式,这样可以避免这样的问题!

~马尼什

于 2018-02-27T12:59:18.097 回答