前言​

The most incomprehensible thing about the world is that it is comprehensible.

世界上最不可理解的地方就是它竟然是可以理解的。-- 阿尔伯特·爱因斯坦

开源（Open-Source）造就了如今繁荣活跃的软件行业。开源让全世界的开发者都能够协力编写出优秀的工具类项目，也就是所谓的 "轮子"，在造福大大小小的公司个人的同时，也可以展现创作者或贡献者的技术实力。如今很多开发者都在大量使用开源项目作为自己项目的第三方库或依赖，更快更高效的完成开发任务。

笔者也不例外。我最近在用 Vue 3 重构 Crawlab 前端的时候，用到了 Element 团队开发的升级版的 ElementUI，也就是 Vue 3 重构的新 UI 框架 Element Plus。Element 团队在 Element Plus 中将该项目用 Vue 3 完全重构，全面拥抱了 TypeScript；而且相比于之前的 Vue 2 版本丰富了部分组件；而整体风格和使用方式跟之前的版本一致；一些 API 在使用上还变得更精简了。因此，笔者在重构 Crawlab 前端初期过程中没有遇到太大的障碍，再加上之前的编写经验，开发过程中显得驾轻就熟。然而，好景不长，随着项目的不断开发，笔者遭遇到一些技术上的困难。更准确的说，在实现一些复杂功能时遇到了来自于 Element Plus 框架本身的限制。虽然最终想方设法将问题解决了，但是我也深刻体会到了硬啃（Hacking）开源项目源代码的困难。因此，也希望借此机会将自己驾驭开源代码的经验分享给读者。

前言​

The only constant in the world is change.

世界上唯一不变的是变化。--《谁动了我的奶酪》作者 斯宾塞·约翰逊

IT 行业变化太快了，尤其是前端开发（Frontend Development）。如果能穿越回 10 年前，碰上一位 Web 开发软件工程师，他一定会告诉你玩转前端就是精通 jQuery 和搞定 IE 浏览器兼容性。不过随着前端的不断发展，jQuery 遭遇 “官方逼死同人” 逐渐退出历史舞台（元素选择和操作被标准的 DOM API 所统一）；而饱为诟病的 IE 浏览器兼容性问题，因为 IE 市场的逐渐萎缩以及一些兼容性工具（Polyfill）的出现，让其从之前的核心优化问题降级为如今的瘙痒问题，不再成为前端工程师的标配。

如今的前端开发，有着玲琅满目的专业术语和纷繁复杂的技术生态，可能会让初入前端开发的工程师感到惴惴不安：要学的东西实在是太多了。现在的前端工程师如果不了解 Webpack、Babel、Node.js、NPM/Yarn、ES6/7、React/Vue、Sass/Less、TypeScript、ESLint、Canvas/SVG 等现代化前端知识，就难以让人信服自己的专业背景。2021 年的前端工程师可能是真正意义上的工程师（Engineer），他们通常需要运用大量的专业知识来解决工程化问题，包括如何将项目进行模块化，如何设计组件间的交互，如何提高可复用性，如何提升打包效率，优化浏览器渲染性能，等等。他们不再像以前，只需要 HTML/CSS/JS 一个套路来开发静态页面。

本文将着重就现代前端开发的主题，来详细介绍前端工程化的各个重要技术，帮助读者了解现代前端页面的复杂和多样性是如何构造的。本文是一篇关于前端工程的科普文，即使你不了解前端技术，也可以从本文受益。

前言​

工欲善其事，必先利其器 --《论语》

在如今被三大框架支配的前端领域，已经很少有人不知道 Vue 了。2014 年，前 Google 工程师尤雨溪发布了所谓的渐进式（Progressive）前端应用框架 Vue，其简化的模版绑定和组件化思想给当时还是 jQuery 时代的前端领域产生了积极而深远的影响。Vue 的诞生，造福了那些不习惯 TS 或 JSX 语法的前端开发者。而且，Vue 较低的学习门槛，也让初学者非常容易上手。这也是为什么 Vue 能在短时间内迅速推广的重要原因。从 State of JS 的调查中可以看到，Vue 的知名度接近 100%，而且整体用户满意度也比较高。

Vue 既强大又易学，这是不是意味着 Vue 是一个完美框架呢？很遗憾，答案是否定的。虽然 Vue 的上手门槛不高，灵活易用，但是这种优势同时也成为了一把双刃剑，为构建大型项目带来了一定的局限性。很多用 Vue 2 开发过大型项目的前端工程师对 Vue 是又爱又恨。不过，随着 Vue 3 的发布，这些开发大型项目时凸显出来的劣势得到了有效解决，这让 Vue 框架变得非常全能，真正具备了跟 "前端框架一哥" React 一争高下的潜力。Vue 3 究竟带来了什么重要的新特性呢？本篇文章将对此进行详细介绍。

前言​

怎么忍心怪你犯了错，是我给你自由过了火。 -- 张信哲《过火》

可能很多软件工程师都或多或少知道或了解 TypeScript（简写 TS），使用过 TypeScript 的前端开发者们也出奇一致的对 TypeScript 抱有好感。如果你在搜索引擎里搜索 TypeScript，会发现几乎铺天盖地都是称赞或表扬 TS 的文章，例如 《TypeScript 让你不会想用回 JavaScript》、《TypeScript 真香系列》、《再不拥抱TypeScript你就老了！》。根据最新的 《2020 State of JS 调研报告》，TypeScript 的受欢迎度（Popularity）以及满意度（Satisfaction）都在逐年增加，包括本文作者在内的 “TS 粉”（在 State of JS 中回答 “会继续使用”）的开发者甚至超过了 70%（如下图）。

总而言之，TS 如今在前端领域具有不可撼动的核心地位，是非常重要的前端工程开发工具。TS 是微软在拥抱开源项目之后为软件行业作出的突出贡献之一。然而，TypeScript 既不能提高 JavaScript 代码在浏览器中的运行效率，又不像 React、Vue 前端框架那样可以提高开发人员的生产力，更不能让你开发的前端页面变得好看而吸引人。那究竟是什么让它成为如此广受欢迎的 “真香语言” 呢，是什么让它令前端人员爱不释手呢？如果你带有这样类似的疑问，请继续阅读接下来的内容，本文将详细解释利用 TS 开发大型前端项目的优势。

背景​

很多优秀的程序员和技术人员喜欢写技术文章和技术博客，通过这样的方式分享传播知识和经验，扩大自己的知名度和影响力，吸引粉丝关注，甚至有些技术博主还通过写文章来获取广告收入，很多优秀的博主还通过这种方法获得了出版书的机会以及工作机会。因此，写技术文章是一件非常值得投入的事情，帮助了自己，也让大众受益。

但是，写技术文章通常也很耗时，特别是一些优质文章，不仅需要旁征博引、构思文章结构、照顾读者受众，还需要做很多前期工作，例如搭建环境、写demo代码、测试代码等等。一篇优质技术文章通常需要3-6个小时来完成。然而，花了很多时间来写文章，最终发布出来的文章得不到很多人的关注是一件相当令人沮丧的事情。我们认为，优质文章值得获取关注和传播，让更多的技术工作者通过阅读文章获取知识获益。

每个技术博主都有自己喜欢的技术媒体平台，例如掘金、CSDN、微信公众号等等。很多技术博主也喜欢将文章发布在不同的平台上，寻求最大的关注度，同时也防止自己辛辛苦苦写的文章被别人复制粘贴盗版过去。然而，在多个平台上发文是一件麻烦的事情：博主需要同时登陆多个媒体平台，将自己的文章复制一个一个粘贴过去；更麻烦的是，有些平台只支持Markdown，有些平台只支持富文本，博主需要在这两者之间来回转换，这增加了工作量。

一文多发平台ArtiPub就解决了这样的问题。下面我们将介绍一下近日刚上线的开源一文多发平台ArtiPub。