Question

我已经浏览了heroes tutorial并通过修改一些组件创建了我自己的Angular2应用程序。但基本上它与英雄教程相同。

我的IDE，npm等所有功能都非常出色，现在我已准备好将我的应用程序部署到生产环境中......我完全迷失了。

在我的索引文件中，我看到有一些对node_module文件的引用。

<script src="node_modules/core-js/client/shim.min.js"></script>
<script src="node_modules/zone.js/dist/zone.js"></script>
<script src="node_modules/systemjs/dist/system.src.js"></script>

很酷，因为我不想在我的服务器上转储30000个文件，我在我的应用程序中创建了一个lib文件夹并在那里复制了必要的文件，然后我链接到它们：

<script src="lib/shim.min.js"></script>
<script src="lib/zone.js"></script>
<script src="lib/system.src.js"></script>

我将所有内容部署到互联网上的应用服务器上。我得到的下一个错误是：

http://frontangle.com/angular2charts/node_modules/@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js 无法加载资源：服务器响应状态为500

好的，看起来我需要导入更多文件，所以我猜你需要从30,000多个node_module文件中剔除碎片。

如果我查看我的systemjs.config文件，那么我会看到：

  // angular bundles
  '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
  '@angular/common': 'npm:@angular/common/bundles/common.umd.js',
  '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
  '@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
  '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
  '@angular/http': 'npm:@angular/http/bundles/http.umd.js',
  '@angular/router': 'npm:@angular/router/bundles/router.umd.js',
  '@angular/router/upgrade': 'npm:@angular/router/bundles/router-upgrade.umd.js',
  '@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',

  // other libraries
  'rxjs':                      'npm:rxjs',
  'angular-in-memory-web-api': 'npm:angular-in-memory-web-api/bundles/in-memory-web-api.umd.js',
  'ng2-charts': 'node_modules/ng2-charts',
  'angular2-color-picker': 'node_modules/angular2-color-picker'

我是否正确地假设，而不是复制这些文件，然后对此处列出的每个角度js文件执行HTML导入，我只能引用一些 angular.min.js 文件，它将处理此处列出的所有角度文件？

所有这些角度文件都来自package.json，并作为版本2.4.5导入。那么我需要在我的新lib目录中使用angular.2.4.5.min.js来封装所有这些文件吗？这就是我需要的全部权利吗？这个可分发文件是否存在于npm引入我的项目的目录林中的任何位置？

接下来，rxjs。我是否只是在＆＃39;捆绑＆＃39;中使用 jxjs.min.js 。目录？并将其复制到我的 lib 文件夹中？

注意：我不想使用webpack或cli或一些花哨的构建工具。我只是想知道如何使我的简单应用程序正常工作。

Answer 1

使用angular CLI并使用 - prod 标记构建。这将缩小/ uglify您的文件以托管到服务器。

从angular2部署英雄应用程序

1 个答案: