前端工程化之路：前端构建工具、模块化、框架、类库、工具汇总

分类: 前端, JavaScript　　标签：
作者: mukti　　时间：2017-01-13 16:42:48 (星期五)

UPDATE: 2018-12-05 17:01

前面多说一句，我觉得前端的灵魂是 AJAX，有了 AJAX 才有了前端这个职业。

本文目录

截至2018年11月28日，github star 数：
image

构建工具、任务流工具 Task Runner

  • webpack 目前最流行的前端模块化打包工具
  • Parcel Web应用打包工具
  • Minipack 一个可以帮助开发者理解打包原理的开源打包工具
  • FIS 源于百度的前端工程构建工具
  • Athena 京东凹凸实验室前端自动化流程构建工具
  • WeFlow 前端开发工作流工具，基于微信 tmt-workflow
  • cooking 源于饿了么的前端构建工具
  • Yeoman 为现代前端而生的、灵活通用的脚手架工具
  • gulp 目前最流行的前端任务流构建工具
  • Grunt
  • Duo 自己吹牛说是下一代前端包管理工具
  • jspm
  • browserify 项目中所有使用require引入的JS模块（包括Node内置模块）并打包，使得Node类项目能在浏览器上运行。不过Css和图片等依然需要手动管理。虽然已有插件，但这不仅违背了设计初衷，也使配置变得杂乱。
  • rollup.js JS 模块化打包，更适合构建独立的 JS 库

其他在线编译模块化工具

  • Sea.js CMD，已经过时的 JavaScript 模块化方案
  • RequireJS AMD，已过时的 JavaScript 模块化方案

框架 Framework

现代框架、综合框架

  • Vue.js 类MVVM，构建数据驱动的 web 界面的库，非严格的MVVM。
  • React 构建用户界面，常配合 Flux 或者 Redux 使用。
  • Angular 1.0 MVC，双向绑定扩展HTML，解耦DOM操作和应用程序逻辑。2.0 MVVM，引入模块化组件模型。
  • Ember MVVM。
  • Dojo 渐进式框架
  • Inferno 类React框架
  • Knockout MVVM的先驱。
  • Riot UI（数据渲染）框架
  • Polymer 帮助开发者创建自定义组件
  • KISSY 跨终端、模块化、高性能、使用简单的 JavaScript 框架
  • Ext JS MVVM，数据密集型 web 应用框架，包括了UI、封装的JS方法（太笨重，已经很少人再用了）
  • Foundation

Server 端框架

跨终端解决方案

  • ionic
  • aurelia 开发浏览器、移动端、桌面端应用的现代前端框架

UI框架

移动端框架

  • Blend Baidu Clouda+ 的组成部分，此外还有 Rapid JS（Node服务端框架）和Runtime（移动端轻应用运行环境）。Blend提供了一套类似Hybrid的解决方案。（感觉缺少维护）

模板引擎

  • Pug 之前叫Jade，一款抽象化的模板框架。

库 Library

  • Lodash 提供模块化、性能和附加功能
  • Underscore.js 函数扩展
  • TypeScript JavaScript类型化超集
  • jQuery 封装方法，提高编程效率，包含 DOM API。
  • Zepto 类jQuery，封装方法，提高编程效率，包含 DOM API。
  • MooTools

代码编译

代码检查

  • ESLint
  • JSHint
  • JSLint

单元测试

  • Mocha
  • Jasmine
  • Jest
  • QUnit

调试工具

  • browsersync 多设备同步测试
  • Fiddler HTTP请求调试工具

包管理工具

  • Bower 前端包管理工具
  • npm 前端工具源，另一个潜在的前端模块源
  • Yarn Facebook推出的高效包管理工具

版本管理

参考文章
– 前端构建：3类13种热门工具的选型参考

您的赞助将会支持作者创作及本站运维

« 上一篇：
下一篇： »

发表评论

▲
TOP