Tips for @angular/cli-第2篇:@angular/cli一些常见的坑

0_1515555181723_11111.png

@angular/cli 这种“全家桶”式的设计带来了很大的方便,同时也有一些人不太喜欢,因为很多底层的东西被屏蔽掉了,开发者不能天马行空地自由发挥。比如:@angular/cli 把底层 webpack 的配置文件屏蔽掉了,很多喜欢自己手动配 webpack 的开发者就感到很不爽。

对于国内的开发者来说,上面这些其实不是最重要的,国内开发者碰到的坑主要是由两点引起的:

  • 第一点是网络问题:比如 node-sass 这个模块你很有可能就装不上,原因你懂的。
  • 第二点是开发环境导致的问题:国内使用 Windows 平台的开发者比例依然巨大,而 @angular/cli 在 Windows 平台上有一些非常恶心的依赖,比如它需要依赖 python 环境、Visual Studio 环境。

所以,如果你的开发平台是 Windows,请特别注意:

  • 如果你知道如何给 npm 配置代理,也知道如何翻墙,请首选 npm 来安装 @angular/cli。
  • 否则,请使用 cnpm 来安装 @angular/cli,原因有三:1、cnpm 的缓存服务器在国内,你装东西的速度会快很多;2、用 cnpm 可以帮你避开某些模块装不上的问题,因为它在服务器上面做了缓存;3、cnpm 还把一些包都预编译好了缓存在服务端,不需要把源码下载到你本地去编译,所以你的机器上可以没有那一大堆麻烦的环境。
  • 如果安装失败,请手动把 node_modules 目录删掉重试一遍,全局的 @angular/cli 也需要删掉重装,cnpm uninstall -g @angular/cli。
  • 如果 node_modules 删不掉,爆出路径过长之类的错误,请尝试用一些文件粉碎机之类的工具强行删除。
  • 最新版本的 @angular/cli 经常会有 bug,尤其是在 Windows 平台上面,所以请不要追新版本追太紧。如果你发现了莫名其妙的问题,请尝试降低一个主版本试试。这一点非常重要,很多初学者会非常困惑,代码什么都没改,就升级了一下环境,然后就各种编译报错。
  • 对于 Mac 用户或者 *nix 用户,请特别注意权限问题,命令前面最好加上 sudo,保证有 root 权限。
  • 无论你用什么开发环境,安装的过程中请仔细看 log。很多朋友没有看 log 的习惯,报错的时候直接懵掉,根本不知道发生了什么。

-----------------------------------这是广告分割线----------------------------------

还有一些非常重要的注意点,也是经常被大家忽略的部分,我在《Angular初学者快速上手教程》里面都有详细的描述和例子,去看看吧!

这份教程是我精心编写的,花了整整一个月的时间,所有文本、demo都是一点一点手敲出来。里面的内容全部贴近实战,很多内容直接来自日常的提问和面对面交谈。

以我一人之力,不可能随时回答那么多人的问题,除非我每天什么都不干,专门人肉答问题。So,请耐下心来认真读完这份教程,有很多小困惑自然就解决了!

微信扫这里:

0_1517532617842_1515388789495-1.jpg

个人经验,安装yarn之后用yarn global add @angular/cli命令可以安装上去,,

登录后回复

与 Angular开发者 的连接断开,我们正在尝试重连,请耐心等待