对于 react、react-router、redux、axios和antd等等这些不经常改动的库、我们让webpack不对他们进行打包，通过cdn引入，可以减少代码的大小、也可以减少服务器的带宽，网站首次加载会更快。
hel-micro，模块联邦sdk化，免构建、热更新、工具链无关的微模块方案 ，欢迎关注与了解
20多天前，遇到一个日程表的业务需求，可以动态增加列、对单元格进行合并，结合公司的jsp项目的已有功能完成单元格的增、删、改操作。进行需求分析整理后，经过了一番查找，发现React版本的antd的表格组件功能很强大，可定制程度很高，可以助我完成这个业务需求的开发。
我们在开发Vue项目时候都知道，在vue开发中某些问题如果前期忽略掉，当时不会出现明显的效果，但是越向后开发越难做，而且项目做久了就会出现问题，这就是所说的蝴蝶效应，这样后期的维护成本会非常高，并且项目上线后还会影响用户体验，也会出现加载慢等一系列的性能问题，下面举一个简单的例子。
最近做了一个需求，后台管理系统添加一个可以动态修改ant-design主题色。查询了大多数的文章，发现基本都是抄来抄去，而且文章记录的也一点也不详细。刚刚把这个功能做完了，顺便记录一下如何去修改主题色。主要使用到的包是antd-theme-generator。使用起来非常方便，而且在热更新时，不会出现 js 内存爆栈现象。
感觉vue3的新特性很舒服，这样才是写软件的感觉嘛。打算用Vue实现自己的一些想法。
说起微前端框架，很多人第一反应就是 single-spa[1]。但是再问深入一点：它是干嘛的，它有什么用，可能就回答不出来了。
还是和平时一样，做完需求，测试通过，愉快地上线。运营侧在大推，推了好几天。突然有一天，都来反馈说页面自己弹出dialog而且关不掉：
我的这个项目， 迭代一年多了， 中间打包配置也没没怎么改过， 毕竟也没什么问题， 速度也还可以。
简单来讲，这些站点都做了一件事情：将 npm 仓库上的包转化成支持 esmodule 的版本并通过 url 来进行分发。
使用该插件，可以在编辑过程中去计算 loader 跟 plugin 的运行时间，针对性的看下某个环境构建速度过慢的原因
# 微前端认知史 微前端不是银弹，它并没有多么高深莫测。 # 为什么需要微前端 # 业务价值 内部应用太多 UI 风格不一致 多应用操作断层 # 工程价值 统一管理 模块拆分、多人协作 发布提速 # 调研到落地实践 # 可能遇到的问题 全局的样式冲突 Shadow DOM CSS Scope CSS in JavaScript JavaScript 污染 tc39/proposal-realms 某些库多版本 Externals -> DLL # 拆解的粒度 # 应用集成 使用
前端爱好者的聚集地 本文主要介绍preload的使用，以及与prefetch的区别。然后会聊聊浏览器的加载优先级。 preload 提供了一种声明式的命令，让浏览器提前加载指定资源(加载后并不执行)，在需要执行的时候再执行。提供的好处主要是 1. 将加载和执行分离开，可不阻塞渲染和 document 的 onload 事件 2. 提前加载指定资源，不再出现依赖的font字体隔了一段时间才刷出 如何使用 preload 使用 link 标签创建 使用 HTTP 响应头的 Link 字段创建 如我们常用到
此 blog 项目是基于 react 全家桶 + Ant Design 的，项目已经开源，项目地址在 github 上。
最近在做一些SAAS产品，Landing page——落地页对于SAAS类产品的重要性不言而喻。之前有想过用wordpress找一些比较漂亮的模板，但想想觉得这个方案对于初期的产品来说还是有点重了。用Vue的话，找了一圈没有发现合适的模板。React体系内，我发现Ant Design生态里有一款Ant Design Landing 框架，简洁明了，又不失美观，比较符合我的需求。
全文共6511字/词，阅读大概需要13分钟，太长不看党请直接移步👉「开始优化」部分直接查看优化手段 背景 前段时间公司服务器网络波动，网站访问变慢，一些性能问题也随之暴露了出来。纷纷反馈在这样的弱网条件下，访问新项目时，加载了近1分钟都没加载出来，而访问其他页面顶多也就30-40s。 在网络恢复后，尝试访问了下页面，无缓存首次打开需要等待近11s的时间，最大的资源达到了3.7M... 在对项目做了一些优化处理后，再次无缓存打开可以发现网页几乎是秒开，平均耗时在1s以内 在这里总结记录一下，基本上都是一些
今天要写的H5朋友圈也是基于笔者开发的cms搭建的，我将仿照微信朋友圈，带大家一起开发一个能发布动态（包括图片上传）的朋友圈应用。有关服务端部分笔者在本文中不会细讲，如果感兴趣的朋友可以参考我的文章:
在每个项目的根目录下面，一般都会有一个 package.json 文件，其定义了运行项目所需要的各种依赖和项目的配置信息（如名称、版本、许可证等元数据）。
“ 关注 前端开发社区 ，回复"1"即可加入 前端技术交流群，回复 "2"即可免费领取 500G前端干货！
今天本来想开源自己写的CMS应用的，但是由于五一期间笔者的mac电脑突然崩溃了，所有数据无法恢复，导致部分代码丢失，但庆幸的是cms的打包文件已上传服务器，感兴趣的朋友可以在文末链接中访问查看。
package.json 是前端每个项目都有的 json 文件，位于项目的根目录。许多脚手架在搭建项目时也会自动帮我们自动初始化好 package.json。
本文使用「署名 4.0 国际 (CC BY 4.0)」许可协议，欢迎转载、或重新修改使用，但需要注明来源。 署名 4.0 国际 (CC BY 4.0)
在 Node.js 中，模块是一个库或框架，也是一个 Node.js 项目。Node.js 项目遵循模块化的架构，当我们创建了一个 Node.js 项目，意味着创建了一个模块，这个模块必须有一个描述文件，即 package.json。它是我们最常见的配置文件，但是它里面的配置你真的有详细了解过吗？配置一个合理的 package.json 文件直接决定着我们项目的质量，本章就带大家了解下 package.json 的各项详细配置。
本文主要介绍preload的使用，以及与prefetch的区别。然后会聊聊浏览器的加载优先级。
在项目开发中，客户反映页面样式错乱问题，经查是 360安全浏览器，使用了较老的 Chrome 内核所致。
在使用 Webpack 时，如果不注意性能优化，可能会产生性能问题，会导致在开发体验上不是非常丝滑，性能问题主要是编译速度慢，打包体积过大，因此性能优化也主要从这些方面来分析。本文主要是自己平时的工作积累和参考别人的文章，而进行总结，基于 Webpack4 版本。
写 react 项目的小伙伴应该都用过 antd 组件库，但绝大多数同学并没有看过它的源码。
Ant Design 是一个服务于企业级产品的设计体系，组件库是它的 React 实现，antd 被发布为一个 npm 包方便开发者安装并使用。
Antd是一个UI组件库, 与React非常搭 善用UI库, 可以节省写css样式的时间 如果我们把写css的时间压缩一大半, 或许就可以早点下班了~ 关于Antd Antd官网 Antd Gith
注意：在webpack.config.dev.js添加的配置部分，也需要在webpack.config.prod.js中做相同的配置。否则可能导致项目发布上线后，报错无法执行。
今天圣诞节，所以在 type 是 primary 的 Button 上都加上了雪花。
温馨提示：因微信中外链都无法点击，请通过文末的 “阅读原文” 到技术博客中完整查阅版；
antd@4 rc 发布已经有一段时间了（大概已经两周了），官网[1] 也已同步放出。最为一个酷爱尝鲜的人，当然要第一时间安装升级。在咨询了豆酱老师得到了api 不会修改的承诺之后，我已经在自己的项目中迁移完成。第一时间享受到了的 antd@4 各种优势。
首先分享一篇网易云音乐技术团队整理的一篇文章 React 组件库 CSS 样式方案分析
首先，确保您的项目已经创建并配置了React环境。然后，您可以通过以下命令使用npm或yarn安装Antd：
在使用 import {Button} from 'antd' 的时候 打开控制台,会出现这样的警告 You are using a whole package of antd, please use https://www.npmjs.com/package/babel-plugin-import to reduce app bundle size. 实际我们在用antd的时候,只需要一个Button组件,它给完全加载进项目了,要知道antd 8W多行代码,执行完之后得花一些时间吧. 于是官方就提供了下面
正在研究 Websocket，先搞一搞 HTML5 特征 Web Notification API 来简单实现浏览器在线的消息推送
React中使用Antd教程文档： https://ant.design/docs/react/getting-started-cn
删除掉import 'antd/dist/antd.less' vite.config.js完整代码
在我们学习JavaScript 的时候，我们学习了一个 bootstrap 的组件库。可以让我们快速开发，但是我们现在学习了 React ，一种组件化编程方式，很少说会去贴大量的 HTML 代码，再配一下 CSS，JS。我们也有一些现成的组件库可以使用，我们只需要写一个组件标签即可调用。这让我们 React 开发变得十分的快速，方便和整洁。
"自在的快乐便是佛家所说的那种境界，“要眠即眠，要坐即坐，如果一个人茶饭不宁，百种需求，千般计较，自然谈不上是真正的放下，又如何感受快乐？真正在的自由是建立于真正的放下之上，一切皆空即是一切皆有”"
在之前的一篇文章已经介绍过了，公司正在使用NG-ZORRO组件库开发后台应用，并且详细的介绍了Angular开发环境的搭建和项目的创建。这篇文章就是为了让大家熟悉了解我们该如何在Angular项目中使用到NG-ZORRO UI组件库搭建后台管理框架。
最近，使用create-react-app 创建的React项目，在运行的时候报了如下一个错误。
如果需要自定义主题颜色 安装@craco/craco可以无需暴露webpack进行配置覆盖
代表了一种开发功能强大的 react.js 组件的全新方式，这些组件在完全可定制的同时开箱即用。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
对象存储
腾讯会议
实时音视频
