TypeScript 捆绑和缩小?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/17385099/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-21 02:49:55  来源:igfitidea点击:

TypeScript bundling and minification?

asp.net-mvctypescriptasp.net-mvc-5

提问by BrunoLM

Assume I have two files

假设我有两个文件

AFile.ts

文件

/// <reference path="ZFile.ts" />
new Z().Foo();

ZFile.ts

ZFile.ts

class Z
{
    Foo() { }
}

Is there a way to generate all scripts in a single jsfile in the order it requires (need ZFilebefore AFileto get the definition of Z)?

有没有办法js按照它需要的顺序在单个文件中生成所有脚本(需要ZFile之前AFile获得 的定义Z)?

采纳答案by Artru

Now VS Typescript Extension supports merging to one file.
Make sure that you have installed the extension Tools -> Extensions and Updates(VS2015 has it by default)

现在 VS Typescript 扩展支持合并到一个文件。
确保你已经安装了扩展Tools -> Extensions and Updates(VS2015 默认有)

enter image description here

在此处输入图片说明

Go to the project properties and check Combine JavaScript output into file: enter image description here

转到项目属性并检查Combine JavaScript output into file在此处输入图片说明

Important to have /// <reference />(as in question), it helps tscorder files by dependencies before the merge.

重要的是/// <reference />(如所讨论的),它有助于tsc在合并之前按依赖项对文件进行排序。



然后可以像往常一样使用最小化包:

bundles.Add(new ScriptBundle("~/bundles/finale").Include("~/js/all.js"));

and in view

并且鉴于

@Scripts.Render("~/bundles/finale")

回答by BrunoLM

In post build events I added a call to TypeScriptcompiler

在构建后事件中,我添加了对TypeScript编译器的调用

tsc "..\Content\Scripts\Start.ts" --out "..\Content\Scripts\all.js"

In the bundle configuration I added

在我添加的捆绑配置中

bundles.Add(new ScriptBundle("~/scripts/all").Include("~/Content/Scripts/all.js"));

On the _Layout.cshtmlfile I added

_Layout.cshtml我添加的文件上

@Scripts.Render("~/Scripts/all")

And with that I got

我得到了

<script src="/Scripts/all?v=vsTcwLvB3b7F7Kv9GO8..."></script>

Which is all my script in a single file.

这是我在一个文件中的所有脚本。



The compiler does not minify, you have to use bundles and compile on Release or set

编译器不会缩小,您必须使用捆绑包并在发布或设置时进行编译

BundleTable.EnableOptimizations = true;

You can also minify using Web Essentials or grabbing the contents and minifing somewhere else.

您还可以使用 Web Essentials 进行缩小或抓取内容并在其他地方缩小。

回答by basarat

Use the --out parameter.

使用 --out 参数。

tsc AFile.ts ZFile.ts --out single.js

The typescript compiler will do the dependency navigation for you automatically.

打字稿编译器会自动为你做依赖导航。

回答by andyks

Assuming all of your ts files are directly or indirectly under a folder called say 'ts' you could write a tt script which merged all of .js files(but not min.js) into a file myApp.js and all of your min.js files into myApp.min.js.

假设您的所有 ts 文件都直接或间接位于名为“ts”的文件夹下,您可以编写一个 tt 脚本,将所有 .js 文件(但不是 min.js)合并到文件 myApp.js 和所有 min.js 文件中。 js 文件到 myApp.min.js。

To obtain the ordering of files you could process subfolders thus:

要获得文件的顺序,您可以这样处理子文件夹:

string[] FolderOrder =
{
    @"libs\utils\",
    @"libs\controls\",
    @"app\models",
    @"app\viewmodels",
    @".",
};