在windows上构建angular项目 (下)

前言

当完成bazel的安装之后,我们还需要安装nodejs就可以开始编译angular了。

Nodejs

目前angular仅支持nodejs12和nodejs14这两个版本,推荐使用node14这个版本。

对于windows平台而言,nodejs可以直接从官网选择windows平台的二进制包下载,然后进行点击安装就可以了,但是我个人更推荐使用nvm-windows

nvm-windows

nvm-windows是windows平台上常用的node版本管理工具,可以方便我们针对不同项目的要求切换不同的node版本。点击该链接,下载最新安装包,然后点击安装。

使用国内镜像

由于国家特殊的网络政策,我们需要使用淘宝镜像:

nvm node_mirror http://npm.taobao.org/mirrors/node/ // 注意结尾有斜杠
nvm npm_mirror https://npm.taobao.org/mirrors/npm/

安装nodejs14

目前node14的最新版是14.17.0,现在我们可以使用nvm来进行安装:

nvm install v14.17.0
nvm use v14.17.0

现在我们可以验证一下node是否正确安装:

node --version

// 结果
v14.17.0

Yarn

Yarn是Facebook开发的nodejs包管理工具,与早期npm相比,具有下载速度快,命令更加友好,提供本版本锁等优势。当然,虽然npm不断的更新迭代,yarn的优势也不再明显,但是angular开发团队更加推荐使用yarn。

在这里需要注意的是,Yarn1.xYarn2.x是两个不兼容的版本,而angular只支持yarnv1.22.4以上且不包括2的版本(即>=1.22.4 <2)。因此在下载的时候请选择正确的版本。

Angular

当bazel、nodejs、yarn都安装完毕之后,我们终于可以在本地开始编译angular了。

下载angular仓库

在终端执行clone命令

git clone --depth=16 https://github.com/angular/angular.git

--depth=16表示仅仅git只会拉去最新16个commit。

安装angular依赖

在安装依赖之前,我们需要先删除sauce-connect依赖,因为该依赖不支持windows,且也不影响我们的编译。

在终端执行yarn命令:

yarn

编译angular

在终端执行编译脚本

node scripts/build/build-packages-dist.js

该命令将会先后编译angular,angular-in-memory-web-api和zone.js三大模块。

如果编译过程中发生错误,可以在重新执行编译脚本之前,执行clean命令:

bazel clean

结果

当上面的命令正确执行完成之后,检查一下dist目录下的编译后的angular代码了:

  1. distangular-in-memory-web-api-distangular-in-memory-web-api目录下是angular-in-memory-web-api
  2. distpackages-dist目录下便是angular各个模块的代码了;
  3. distzone.js-dist目录下的是zone.js

总结

到此,windows上编译angular就算是完成了。angular使用bazel作为编译工具,确实导致编译的成本高了很多,尤其是在windows平台,但是不停探索的过程,是一个不断学习的过程。这个过程,不挣钱,就是交个朋友。

原文地址:https://www.cnblogs.com/xiao2/p/14778718.html