Typescript编译为单个文件 [英] Typescript compile to single file

问题描述

我正在使用TS 1.7，我正在尝试将我的项目编译为一个大文件，我将能够包含在我的html文件中。

I'm using TS 1.7 and I'm trying to compile my project to one big file that I will be able to include in my html file.

My项目结构如下所示：

My project structure looks like this:

-build // Build directory
-src // source root
--main.ts // my "Main" file that uses the imports my outer files
--subDirectories with more ts files.
-package.json
-tsconfig.json

我的tsconfig文件是：

my tsconfig file is:

 {
  "compilerOptions": {
    "module":"amd",
    "target": "ES5",
    "removeComments": true,
    "preserveConstEnums": true,
    "outDir": "./build",
    "outFile":"./build/build.js",
    "sourceRoot": "./src/",
    "rootDir": "./src/",
    "sourceMap": true
  }
}

当我构建项目时，我希望build.js文件是我的源代码编译的一个大文件。
但是build.js文件是空的，我把所有文件都编译成了js文件。

When I build my project I expect the build.js file to be one big file compiled from my source. But ths build.js file is empty and I get all of my files compiled o js files.

我的每个TS文件看起来都像这样

Each of my TS files look a bit like this

import {blabla} from "../../bla/blas";

export default class bar implements someThing {
    private variable : string;
}

我做错了什么？

推荐答案

这将在 TypeSript 1.8 中实现。使用该版本时，当模块 amd 或系统时， outFile 选项有效。

This will be implemented in TypeSript 1.8. With that version the outFile option works when module is amd or system.

此时此功能在Typescript的开发版本中可用。
安装该运行：

At this time the feature is available in the development version of Typescript. To install that run:

$ npm install -g typescript@next

对于以前的版本，即使不明显模块和 outFile 选项也不能一起工作。

For previous versions even if it's not obvious the module and the outFile options can not work together.

您可以查看这个问题更多详细信息。

You can check this issue for more details.

如果要输出版本低于1.8的单个文件，则无法使用 tsconfig.json 中的模块选项。相反，您必须使用模块关键字创建名称空间。

If you want to output a single file with versions lower than 1.8 you can not use the module option in tsconfig.json. Instead you have to make namespaces using the module keyword.

您的 tsconfig.json 文件应如下所示：

Your tsconfig.json file should look like this:

{
  "compilerOptions": {
    "target": "ES5",
    "removeComments": true,
    "preserveConstEnums": true,
    "outFile": "./build/build.js",
    "sourceRoot": "./src/",
    "rootDir": "./src/",
    "sourceMap": true
  }
}

此外，您的TS文件应如下所示：

Also your TS files should look like this:

module SomeModule {
  export class RaceTrack {
    constructor(private host: Element) {
      host.appendChild(document.createElement("canvas"));
    }
  }
}

而不是使用import语句，你必须引用按命名空间导入。

And instead of using the import statement you'll have to refer to the imports by namespace.

window.addEventListener("load", (ev: Event) => {
  var racetrack = new SomeModule.RaceTrack(document.getElementById("content"));
});

这篇关于Typescript编译为单个文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！