升级至 Angular 13+ 后开发模式太慢的原因及构建性能优化 这是一篇升级 Angular 13后遇到的问题实践经验与总结。主要包括了开发模式下构建速度慢的原因分析与解决和自定义 webpack 配置 dll 支持的方法。 前端开发 任侠 2022-12-18 1403 热度 0评论
Angular 单元测试框架由 karma 迁移为 Jest 实践 1 为什么要从 Karma+Jasmine 切换为 Jest Angular 官方默认推荐的单元测试框架为 Karma + Jasmine。 Karma 是通过启动 Chromium 浏览器,在真实的浏览器环境中执行单元测试。 Jest 通过配置指定运行环境,通常会配置为 jsdom,每个测试文件都在独立的运行环境中执行。 Karma 当前存在的主要问题有: 需要启动浏览器,编译整个项目并在浏览器 前端开发 任侠 2022-10-20 1654 热度 1评论
Angular 9 新特性及 Angular 8 升级至 Angular 9 参考 1 Anguar9 新特性简介 1.1 默认使用 Ivy 编译器 Ivy 在 Angular8 时即可使用,但需要自行在 tsconfig.json 中增加配置以开启,曾经尝试过但会有一些构建问题。在解决了数百 BUG 后,Ivy 在 Angular9 中 作为了默认的编译方式。lvy 编译器和运行时提供了不少的优点: 打包尺寸更小:Ivy 编译器的设计目的是删除那些无法通过摇树优化使用的 Ang 前端开发 任侠 2020-05-12 4335 热度 1评论
升级至 Angular8 及实现自定义 webpack 配置的方案 1 升级至 Angular8 如果你使用的是 angular/cli 构建方案,执行 ng update 即可,该过程主要是更新 package.json 中的依赖。为了了解到底改变了哪些内容,个人更喜欢手动方式升级,方法参考如下: 首先全局安装 @angular/cli: npm i -g @angular/cli; 然后创建一个新的项目 ng new ng8-demo; 对比测试项目 ng8- 前端开发 任侠 2019-12-24 5645 热度 2评论
使用 commitlint 约束项目 Git 代码提交描述信息格式规范 1 Angular Git Commit Guidelines 规范 Git 提交应当书写 commit message。message 的内容怎么写都行,但如何写比较合理是一个问题。开源社区有很多相关的规范,使用最广泛的则是Angular Git Commit Guidelines 规范,并且有众多相关的工具可以检测提交是否遵循了预定义的规范。 Angular 规范要求的 commit mess 前端开发 任侠 2019-09-24 5515 热度 1评论
nodejs 执行失败报错 “JavaScript heap out of memory” 的解决办法 报错信息很直观地指出是内存溢出了。是什么导致了内存溢出呢?其根本原因在于 nodejs 默认限制了最大可使用的内存大小。 nodejs V8 引擎在 64 位机器上默认限制使用内存最大不超过 1.7GB,超过这个限制官方建议尝试优化为多线程方式。 解决办法可以是增加 nodejs 可使用的最大内存大小,也可以从降低程序内存消耗的角度入手。 解决办法一: 设置 nodejs 配置项 配置项 max_ 前端开发 任侠 2018-12-26 12260 热度 0评论
在 Angular-cli 中引入 simple-mock 实现前端开发 API Mock 接口数据模拟 在前后端分离的开发模式中,接口数据模拟(API Mock)是不可避免的事情。前端同学在应对该情况时采取的办法可以各种各样,大概的方案可能会是这几类: 业务代码中临时写上 mock 数据的逻辑 在前端引入 mock 服务或框架,对 HTTP 请求服务进行拦截 代理转发至自建的 mock server 本文主要介绍在 Angular-cli 中引入 simple-mock 以快速实现项目数据接口模拟功 前端开发 任侠 2018-11-23 5973 热度 2评论
Angular 中实现自定义组件的双向绑定的两种方法 在 Angular 中,对于表单元素,通过 即可以简单地实现双向绑定。对于自定义组件而言,希望实现同样的效果可以怎么做呢? 1 实现自定义组件的 ngModel 指令 如果希望自定义组件能够具有与表单元素相同的 ngModel 效果,可以通过在组件内实现 ControlValueAccessor 接口达到目的。 对于 ,需要至少实现该接口的如下方法: 前端开发 任侠 2018-11-22 4952 热度 0评论
一种自定义 Angular-cli 6.x/7.x 默认 webpack 配置的方法 Angular-cli 通过 angular.json 实现构建配置,对于复杂配置需求的支持,可以通过 ng eject 输出 webpack 的配置文件,然后自定义 webpack 来达到目的。 当前对于 Angular 6.x/7.x 的项目,Angular-cli 需采用 6.x/7.x 版本,而这些版本不支持 ng eject 命令,于是希望自定义 webpack 配置实现更多复杂需求就无 前端开发 任侠 2018-11-09 5758 热度 1评论
Angular 项目升级至 Angular6 前段时间将所负责的 Angular2 项目升级到了 Angular5 版本,这两天又进行了升级至 Angular6 的尝试。总的来说,两次升级过程比较类似,也不算复杂。 0. 项目特点 该项目有如下特点: 历史悠久,项目庞大,源码文件数量近千 业务代码为主,极少应用 Angular 高级特性(升级简单) 采用 pug 编写 html 结构 采用 Less 编写 css 样式 采用 Express 前端开发 任侠 2018-08-30 3816 热度 0评论