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应用程序. 这里有一些资源:

移除不需要的构建文件

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 repogh-pages分支 并且使用peanut构建.

Firebase

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

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏晨星先生的自留地

安装pocsuite遇到了git命令的问题

34440
来自专栏Java技术栈

Java 程序员必备的 Intellij IDEA 插件

支持lombok的各种注解,从此不用写getter setter这些 可以把注解还原为原本的java代码 非常方便

42830
来自专栏云计算

6个虚拟机备份和恢复的最佳实践

虚拟机的架构与传统的物理机有着天壤之别,因此不适合于传统的备份方案。在本文中,我们将介绍一些虚拟机备份的最佳实践。

233100
来自专栏哈雷彗星撞地球

Mac 下安装node.js

Node.js 是一个用Chrome's V8 JavaScript engine 构建的 JavaScript 运行时框架。Node.js 使用事件驱动、非阻...

24150
来自专栏后端技术探索

Nginx面试中最常见的18道题 抱佛脚必备

Nginx的并发能力在同类型网页服务器中的表现,相对而言是比较好的,因此受到了很多企业的青睐,我国使用Nginx网站的知名用户包括腾讯、淘宝、百度、京东、新浪、...

35830
来自专栏用户2442861的专栏

Nginx初探

http://blog.csdn.net/xlgen157387/article/details/49781487

15530
来自专栏ml

Servlet后续的尾(yi)巴--------Filter过滤器

                              -------载录自  http://www.blogjava.net/yangaiyou/arch...

26970
来自专栏北京马哥教育

这8种命令都不会,还算什么Linux运维!

01 查看系统内核版本 显示了系统名称(CentOS)和内核版本(release 6.5) The file /etc/issue is a text file...

37070
来自专栏ionic3+

解决ionic4编译过慢的问题

ionic4中编译一次需要几十秒,远比ionic3久,在Github上看有没有人反馈这个问题,发现还真的有,而解决方法是:

64500
来自专栏成猿之路

这是我用过的最好的Intellij插件

https://plugins.jetbrains.com/plugin/7495--ignore

24660

扫码关注云+社区

领取腾讯云代金券