Open
Description
After posting this bug on several projects, I ended up posting it in here. I am trying to import HTML templates in typescript while using the text plugin. Typescript is set to generate commonjs modules and target es5 and the text plugin produces es modules. In this configuration, the bundle generated by the jspm bundle looks like this:
System.register("app/components/component.html", [], function (_export, _context) {
"use strict";
return {
setters: [],
execute: function () {
Object.defineProperty(exports, "__esModule", { value: true });
exports.__useDefault = true;
exports.default = "<div>....</div>";
}
};
});
Using this bundle in the browser produces the error exports is not defined.
Aligning the text plugin to generate cjs modules
'use strict';
module.exports = {
translate: function (load) {
load.metadata.format = 'cjs';
var output =
'module.exports = function () {' +
' return module.exports["default"].apply(this, arguments);' +
'};'+
'Object.defineProperty(module.exports, "default", {value: '+JSON.stringify(load.source)+'});';
return output;
}
}
fixes this problem and the bundle looks like this:
System.registerDynamic("app/components/component.html", [], true, function ($__require, exports, module) {
var global = this || self,
GLOBAL = global;
module.exports = function () {
return module.exports["default"].apply(this, arguments);
};
Object.defineProperty(module.exports, "default", { value: "<div>...</div>" });
});
The issue has been discussed a little bit in here, with @guybedford and @aluanhaddad trying to get to the bottom of it.
Any help would be appreciated. Thanks.
Metadata
Metadata
Assignees
Labels
No labels