My AngularJS controller looks like this:
ArticleController.prototype = Object.create(BaseController.prototype);
/* @ngInject */
function ArticleController (CommunicationService){
//Some code unrelated to the issue
}
I minified it using gulp:
return gulp.src(pathsToMinify)
.pipe(require('gulp-ng-annotate')())
.pipe(require('gulp-uglify')())
.pipe(require('gulp-concat')('application.min.js'))
.pipe(gulp.dest('dist'));
However, I decided to transition from plain Javascript to Typescript, starting with BaseController:
class BaseController {
constructor() {
//Some code not related to the problem
}
}
After minification and concatenation, I encountered an error:
Uncaught TypeError: Cannot read property 'prototype' of undefined
This error is related to this line:
ArticleController.prototype = Object.create(BaseController.prototype);
I realized that the Typescript compiler outputs BaseController as a variable within an IIFE:
var BaseController = (function () {
function BaseController() {
}
BaseController.prototype.setPath = function (path) {
this._path = path;
};
//Some code not related to the problem
return BaseController;
})();
The issue seems to be caused by variable/function hoisting in Javascript. By manually replacing the variable and IIFE with a function, the problem is resolved:
function BaseController() {
}
//Some code not related to the problem
Is there a way to fix this problem, such as instructing the Typescript compiler to output a function instead of a variable with IIFE? Or do I need to handle it differently? Any help would be appreciated, as I am new to Typescript and didn't anticipate encountering issues like this.