专栏首页ionic3+更小更快更易用的Angular5管中窥豹

更小更快更易用的Angular5管中窥豹

这一段时间留意到Angular5的版本更新速度飞快,几乎两三天就一个版本,我就知道它快要来了。

image.png

然后今天就真的来了!虽说我对Angular5的内容有了解到一些,但是还是想看到官方或专家的详细描述,等到此文:Version 5.0.0 of Angular Now Available.

image.png

由于上班也不好意思占用太多时间做自己的私事,我就不耗费翻译的时间了,迫不及待的撸个新项目看看。

第一步,升级@angular/cli

创建Angular5项目,要更新angular-cli到1.5版本以上(其实angular-cli已换成@angular/cli)。如果未安装过angular-cli,则直接执行此句命令并跳过后续所有步骤即可npm install -g @angular/cli@latest

至于怎么更新可以看Github:https://github.com/angular/angular-cli,具体操作如下:

首先敲入命令查看下当前cli版本:

ng -v

angular-cli版本

看到版本是1.4.5,低于1.5,所以我们敲入以下命令更新:

npm install -g @angular/cli@latest

npm update -g @angular/cli

如果你使用的是Angular CLI 1.0.0-beta.28或以下版本, 你需要先卸载angular-cli包,从angular-cli向 @angular/cli转化:

npm uninstall -g angular-cli
npm uninstall --save-dev angular-cli

升级全局包(Global package):

npm uninstall -g @angular/cli
npm cache clean
npm install -g @angular/cli@latest

注:如果npm版本大于5就使用npm cache verify去代替上述npm cache clean命令以避免错误.

注:如果要升级旧项目,本地包也需要升级,就先cd 项目,然后执行下述命令:

rm -rf node_modules dist
npm install --save-dev @angular/cli@latest
npm install

第二步,新建一个Angular5的项目

执行以下命令:

ng new angular5
cd angular5
ng serve

打开localhost:4200/即可看到页面。

我们执行下打包命令:

ng build --prod

查看命令输出窗口,对比下常规运行和打包后的内容,可以看到文件得到了非常大的压缩

Angular5项目运行与打包

接着我们又打包一个Angular4的项目来比较一下:

Angular4项目打包

发现在Angular5中没有vendor,而总体大小也小了50多K,看上去貌似不多,但是按比例来看就很可观了,或许当项目越大会越明显,时间有限,简单测试就到此先告一段落,后续再添加翻译和做进一步测试。

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

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 解决ionic4编译过慢的问题

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

    IT晴天
  • brew和npm小记

    在Ubuntu中,常用apt-get来管理安装应用,与之对应,在Mac的OSX系统常用的是Homebrew,简称brew,使用上有点像npm。

    IT晴天
  • 【开发指南】(一)Ionic3开发环境配置常规ionic的环境搭建如下:

    工欲善其事,必先利其器,搭好环境是开发的前提,有时环境没弄好,不时报错往往很扎心。

    IT晴天
  • 为什么一线大厂面试必问redis,有啥好问的?

    除了5种常用类型,还有bitmaps、hyperloglogs 、geospatial等类型。

    Java学习录
  • Redis 3.0.0正式版发布,全新的分布式高可用数据库

    我是攻城师
  • 常见的Redis面试题及分布式集群讲解

    Tanyboye
  • 缓存技术PK:选择Memcached还是Redis?

    老七Linux
  • Redis 做分布式锁你会几种姿势?

    Redis 简简单单的几种数据类型,一个 key/value 数据库,现在又是分布式锁、又是限流工具、又是消息队列......,感觉都要被玩坏了。不过话说回来,...

    江南一点雨
  • Torch7搭建卷积神经网络详细教程

    (如果有好的建议和问题欢迎在留言区指出) 之前的博文,如一文读懂卷积神经网络(CNN)、多层网络与反向传播算法详解、感知机详解、卷积神经网络详解等已经比较详细的...

    昱良
  • Redis【入门】就这一篇!

    在我们日常的Java Web开发中,无不都是使用数据库来进行数据的存储,由于一般的系统任务中通常不会存在高并发的情况,所以这样看起来并没有什么问题,可是一旦涉及...

    我没有三颗心脏

扫码关注云+社区

领取腾讯云代金券