I've been facing a challenge with splitting TypeScript modules containing classes into separate files. Despite searching for solutions, none have resolved my specific issue.
Currently, I have a module called store that contains two classes: Person and SerialisedRecord. When both classes are in one file, everything compiles and exports correctly.
Now, my goal is to have individual files for each class - Person.ts and SerialisedRecord.ts, following the same export structure as before. However, I'm unsure how to proceed with this setup.
Here's the initial configuration:
store.ts
export module store {
export class Person {
public fullName: string = '';
constructor(firstName: string, lastName: string) {
this.fullName = `${firstName} ${lastName}`;
}
}
export class SerialisedRecord {
constructor(public serialised: string, public id: string) {}
}
}
When compiling store.ts to store.js (ES5), the output meets expectations - a SystemJS module exporting both classes within one module.
System.register([], function(exports_1, context_1) {
"use strict";
var __moduleName = context_1 && context_1.id;
var store;
return {
setters:[],
execute: function() {
(function (store) {
var Person = (function () {
function Person(firstName, lastName) {
this.fullName = '';
this.fullName = firstName + " " + lastName;
}
return Person;
}());
store.Person = Person;
var SerialisedRecord = (function () {
function SerialisedRecord(serialised, id) {
this.id = id;
this.serialised = serialised;
}
return SerialisedRecord;
}());
store.SerialisedRecord = SerialisedRecord;
})(store = store || (store = {}));
exports_1("store", store);
}
}
});
My attempted modification was:
export module store {
export {Person} from "./Person";
export {SerialisedRecord} from "./SerialisedRecord";
}
However, this resulted in an error message stating:
error TS1194: Export declarations are not permitted in a namespace.
If you could provide guidance on what I might be doing incorrectly, it would be greatly appreciated.
Below is my tsconfig.json:
{
"compilerOptions": {
"module": "system",
"moduleResolution": "node",
"noEmitOnError": true,
"noImplicitAny": false,
"noImplicitReturns": true,
"removeComments": true,
"target": "es5"
},
"exclude": [
"node_modules",
"typings/browser",
"typings/browser.d.ts"
]
}