「这是我参与11月更文挑战的第16天,活动详情查看:2021最后一次更文挑战」
脚手架工具 - 前端工程化的发起者
前言
首先我们需要了解什么是前端工程化?
前端工程化是使用相对应的技术和方法来进行前端的开发流程、技术、工具、编码等规范化、标准化提高效率和降低成本
那我们就先从脚手架开始,去探讨前端工程化在项目创建中的表现
脚手架的本质作用
脚手架就是一个自动帮我们创建一个基础项目的工具(创建项目基础结构、提供项目规范和约定),看似很普通的需求,背后却包含一定的哲学,通常呢我们开发项目的时候,都会有一些约定:
- 相同的组织结构
- 相同的开发范式
- 相同的模块依赖
- 相同的工具配置
- 相同的基础代码 那这样意味着我们在进行新项目的开辟时,需要做很多重复的工作,脚手架工作就可以避免这种情况
举个例子
IDE创建项目的过程就是一个脚手架的工作流程
但是因为前端技术类型比较多,这里我们针对一些常用的脚手架工具进行一些解析
常用的脚手架工具:
目前市面上有很多成熟的脚手架工具,不过很多脚手架工具都是为特殊的框架进行服务的
- 适用于特殊框架
- React项目: create-react-app
- Vue.js项目: vue-cli
- Angular项目: angular-cli 这几个脚手架的使用方式都大同小异,无外乎你提供特定的信息,然后脚手架创建对应的项目基础解构,以及相关的一些配置。
- 通用性脚手架,例如:
- Yeoman
- 创建特定类型的脚手架工具,例如:
- Plop 当我们需要创建一个组件/模块所需要的文件(特定的文件,或由特定解构的时候)使用的
总结
本文我们查看了一些脚手架工具,接下来我们会挑选几个比较有代表性的进行深入探究