AngularDart4.0 高级-部署

部署AngularDart web应用程序与部署其它web应用程序相似 , 除了你须要先将应用程序编译成JavaScript. 本页描述如何编译你的应用程序—使其更快更小的技巧—和引导你使用服务应用程序的一些资源.

构建应用程序

使用pub build命令来构建应用程序, 将其编译到JavaScript 而且生成部署所需的全部资源. 当使用默认pub设置时,获得一个适当小的JavaScript文件,得益于dart2js编译器对3次握手的支持.

作一点额外的工做, 可使你的可扩展应用程序 更小, 更快, 更稳定.

使用pub build进行编译

为应用程序建立一个可扩展的版本, 使用pub build命令. 默认状况下, 命令使用dart2js和Angular transformer生成实现应用程序的JavaScript文件. 下面是使用pub build命令和默认设置发生的改变:

• 可扩展文件出如今应用程序的build/web目录.
• dart2js编译器在release模式下工做, 在build/web/main.dart.js里生成足够小的JavaScript.
• 只要dart_to_js_script_rewriter是应用程序pubspec.yaml文件中的最后一个转换器 (或者几乎最后一个, 若是你使用$dart2js转换器), build/web/index.html文件将被从新链接到main.dart.js而不是main.dart.

查看更多信息, 查看文档中的pub build, 或者在starter app discussion搜索pubspec.

使用dart2js 标记生成更好的JavaScript

Google的应用程序一般使用以下dart2js 选项:

• --trust-type-annotations
• --trust-primitives
• --fast-startup

使用这些选项部署前先测试应用程序! 若是应用程序在检查模式下使用dart2js中或在dartdevc模式下运行, 那么咱们推荐使用--trust-type-annotations. 然而, --trust-primitives可能会产生意想不到的结果 (即便代码类型正确)若是你的数据不老是通过验证. 使用上述二者构建应用程序不推荐使用--fast-startup, 你能够判断使JavaScript加速增大是否值得.

Dart 2.0 note: Dart 2.0中没有检查模式. 更多信息, 查看Dart 2.0 Updates.

Important: 在使用--trust-*开头的两个选项之一以前，确保应用程序拥有良好的测试覆盖. 若是某条代码路径没有通过测试, 应用程序能在dartdevc下运行，使用dart2js编译时出现不正确的行为.

在应用程序的pubspec文件中可使用$dart2js转换器指定dart2js选项 , 在pubspec文件中哪个是最后一个转换器:

transformers:
- ...all other transformers...
- $dart2js:
    commandLineOptions: [--trust-type-annotations, --trust-primitives, --fast-startup]

更多信息, 查看dart2js size和speed选项和configuring the dart2js transformer for pub上的文档.

让应用程序更快、更小、更稳定

下面的步骤是可选的,但这些能加强应用程序的稳定性和响应能力.

• 使用 pwa 包使应用程序能离线工做
• 使用缓存加载下降程序初始加载大小
• 遵循Web应用程序最佳实践
• 移除不须要的构建文件

使用 pwa 包使应用程序能离线工做

pwa包简化使应用程序功能有限或不需链接的工做. 使用此包的更多信息, 查看Making a Dart web app offline-capable: 3 lines of code.

使用缓存加载下降程序初始加载大小

可使用Dart的缓存加载的支持来减小应用程序初始化下载的大小, 如使用Angular Dart懒加载中的描述.

遵循Web应用程序最佳实践

Web应用程序的一般建议,适用于AngularDart web应用程序. 这里有一些资源:

• Web 基础 (尤为最优化社群效率)
• 渐进式Web应用程序
• 灯塔

移除不须要的构建文件

Angular转换器一般会产生许多中间文件(使用后缀像.ng_meta.json和.ng_summary.json) 当部署应用程序时是不须要的.移除这些文件,可使用以下的命令:

# From your app's top directory:
$ find build -name "*.ng_*.json" -exec rm {} +

向应用程序提供服务

能够向AngularDart应用程序提供服务就像其它Web程序同样. 这一部份内容指导Angular应用程序的一些建议, 正如Dart-specific资源帮助你使用 GitHub Pages 或 Firebase 来向应用程序提供服务.

Angular-特殊技巧

你可能须要制做服务器变动信息, 查看Angular TypeScript 部署文档的Server configuration部分 

GitHub页

 若是应用程序没有路由或服务端请求支持, 你可使用GitHub页来向应用程序提供服务. peanut包是为 Dart web应用程序生成一个gh-pages分支的简易方式.
startup_namer example使用GitHub 页做为主机.它的文件在filiph/startup_namer repo的gh-pages分支 而且使用peanut构建.

Firebase

使用Firebase向聊天程序经过漫游服务, 查看使用Dart, Angular 2和 Firebase 3构建一个实时聊天Web应用程序.
其它资源:

• Google I/O 2017 代码实验室构建一个AngularDart & Firebase Web 应用程序漫游使用Firebase为服务端通讯, 可是不包含对服务应用程序的说明.
• Firebase主机代管描述如何使用Firebase配置Web应用程序.
• 在Firebase主机代管文档中, 自定主机代管行为覆盖重发, 改写, 和更多