angular-flex 6.0.0-beta.16 has a bug that breaks the AOT compiler; CLI throws: ERROR in Error during template compile of 'AppModule' Function calls are not supported in decorators but 'FlexLayoutModule' was called.
flex-layout fixed this bug in beta.17: angular/flex-layout#778
after upgrading to beta.17, cli compiles, but app fails at runtime with error: ERROR TypeError: Cannot read property 'alias' of undefined
trace points this to this block of compiled code: r[t.alias] ? ib(r[t.alias], t) : r[t.alias] = t
which maps back to this function in flex-layout-core.umd.js:
/**
* Merge a custom breakpoint list with the default list based on unique alias values
* - Items are added if the alias is not in the default list
* - Items are merged with the custom override if the alias exists in the default list
* @param {?} defaults
* @param {?=} custom
* @return {?}
*/
function mergeByAlias(defaults, custom) {
if (custom === void 0) { custom = []; }
var /** @type {?} */ dict = {};
defaults.forEach(function (bp) {
dict[bp.alias] = bp;
});
// Merge custom breakpoints
custom.forEach(function (bp) {
if (dict[bp.alias]) {
extendObject(dict[bp.alias], bp);
}
else {
dict[bp.alias] = bp;
}
});
return validateSuffixes(Object.keys(dict).map(function (k) { return dict[k]; }));
}
hypothesis: custom
is being passed in to mergeByAlias
as [undefined, undefined]
, when it goes into forEach
, it fails.
to test:
- alter source so custom is empty array by default and recompile
- build without uglifying and step through (angular.json -> configurations.production.optimization: false)
results:
correct, it seems to be a problem with the injection token BREAKPOINT (flex-layout-core.umd.js):
/**
* @fileoverview added by tsickle
* @suppress {checkTypes} checked by tsc
*/
/**
* Injection token unique to the flex-layout library.
* Use this token when build a custom provider (see below).
*/
var /** @type {?} */ BREAKPOINTS = new core.InjectionToken('Token (@angular/flex-layout) Breakpoints', {
providedIn: 'root',
factory: function () {
var /** @type {?} */ breakpoints = core.inject(BREAKPOINT);
var /** @type {?} */ layoutConfig = core.inject(LAYOUT_CONFIG);
var /** @type {?} */ bpFlattenArray = [].concat.apply([], (breakpoints || [])
.map(function (v) { return Array.isArray(v) ? v : [v]; }));
var /** @type {?} */ builtIns = (layoutConfig.disableDefaultBps ? [] : DEFAULT_BREAKPOINTS)
.concat(layoutConfig.addOrientationBps ? ORIENTATION_BREAKPOINTS : []);
return mergeByAlias(builtIns, bpFlattenArray);
}
});
variable breakpoints is [undefined, undefined]
after this