TypeScript 子產品的設計理念是可以更換的組織代碼。
子產品是在其自身的作用域裡執行，并不是在全局作用域，這意味着定義在子產品裡面的變量、函數和類等在子產品外部是不可見的，除非明确地使用 export 導出它們。類似地，我們必須通過 import 導入其他子產品導出的變量、函數、類等。
兩個子產品之間的關系是通過在檔案級别上使用 import 和 export 建立的。
子產品使用子產品加載器去導入其它的子產品。 在運作時，子產品加載器的作用是在執行此子產品代碼前去查找并執行這個子產品的所有依賴。 大家最熟知的JavaScript子產品加載器是服務于 Node.js 的 CommonJS 和服務于 Web 應用的 Require.js。
此外還有有 SystemJs 和 Webpack。
子產品導出使用關鍵字 export 關鍵字，文法格式如下：
// 檔案名 : SomeInterface.ts
export interface SomeInterface {
// 代碼部分
}
要在另外一個檔案使用該子產品就需要使用 import 關鍵字來導入:
import someInterfaceRef = require("./SomeInterface");
/// <reference path = "IShape.ts" />
export interface IShape {
draw();
import shape = require("./IShape");
export class Circle implements shape.IShape {
public draw() {
console.log("Cirlce is drawn (external module)");
export class Triangle implements shape.IShape {
console.log("Triangle is drawn (external module)");
import circle = require("./Circle");
import triangle = require("./Triangle");
function drawAllShapes(shapeToDraw: shape.IShape) {
shapeToDraw.draw();
drawAllShapes(new circle.Circle());
drawAllShapes(new triangle.Triangle());
使用 tsc 指令編譯以上代碼（AMD）：
得到以下 JavaScript 代碼：
define(["require", "exports"], function (require, exports) {
});
var Circle = (function () {
function Circle() {
Circle.prototype.draw = function () {
};
return Circle;
})();
exports.Circle = Circle;
var Triangle = (function () {
function Triangle() {
Triangle.prototype.draw = function () {
return Triangle;
exports.Triangle = Triangle;
define(["require", "exports", "./Circle", "./Triangle"],
function (require, exports, circle, triangle) {
function drawAllShapes(shapeToDraw) {
使用 tsc 指令編譯以上代碼（Commonjs）：
console.log("Cirlce is drawn");
var circle = require("./Circle");
var triangle = require("./Triangle");
輸出結果為：