Question

我使用 Angular2 和 TypeScript 在 Visual Studio 2015 中开发Web应用程序。我使用 Gulp 生成分布式缩小js文件。使用 Angular2 ，我看到， Visual Studio 和 Gulp 都不需要将 TypeScript 转换为< strong> SystemJs 在导入模块时执行此操作。

现在的问题是：

SystemJs如何处理缩小，丑化等问题？

System.import('app/main').then(null, console.error.bind(console));

如何缩小或丑化这个？

Answer 1

SystemJS是

通用动态模块加载器 - 在浏览器和NodeJS中加载ES6模块，AMD，CommonJS和全局脚本。适用于Traceur和Babel。

实际上，有两种方法可以使用SystemJS：

在浏览器中透明您的TypeScript文件。这意味着SystemJS加载您的模块，它加载相应的TypeScript文件并在运行中进行转换。在这种情况下可以使用以下配置：

<script>
  System.config({
    transpiler: 'typescript', 
    typescriptOptions: {
      emitDecoratorMetadata: true
    },
    packages: {
      'app': {
        defaultExtension: 'ts'
      }
    } 
  });
  System.import('app/main')
     .then(null, console.error.bind(console));
</script>

使用以前编译的文件。在这种情况下，您需要使用TypeScript编译器从TypeScript编译器生成JS文件。这些JS文件直接依赖SystemJS API来注册和导入模块。

<script>
  System.config({
    packages: {
      'app': {
        defaultExtension: 'js'
      }
    } 
  });
  System.import('app/main')
     .then(null, console.error.bind(console));
</script>

这个问题也可以帮到你：

Development on Angular2 with TS but without NPM

这是针对上下文的。关于你的问题，似乎你使用第一个选项。要回答你的问题，缩小事物只对第二种选择有意义。事实上，这相当于优化了为应用程序加载的元素（网络调用的数量，文件的大小）。由于您使用已编译的JS文件作为此选项，因此您可以缩小/ uglify它们。如果只想创建一个JS文件，可以考虑TypeScript编译器的outFile属性。

有关详细信息，请参阅此问题：

How to combine (minify) compiled Angular 2 components?

具有Minification / Uglify的Angular2 TypeScript转换器

1 个答案: