什么是前端脚手架

随着前端工程化的概念越来越深入人心，脚手架应运而生。简单来说，「前端脚手架」就是指通过选择几个选项快速搭建项目基础代码的工具。前端脚手架可以有效避免我们 ctrl + C 和 ctrl + V 相同的代码框架和基础配置。

前端脚手架工具有以下优点:

• 可以帮助我们快速生成项目的基础代码;
• 脚手架工具的项目模板经过了开发者的提炼和检验,一定程度上代表了某类项目的最佳实践;
• 脚手架工具支持使用自定义模板，我们可以根据不同的项目进行定制;

背景

在我最开始学习 React 的时候,使用的脚手架就是 create-react-app,我想大部分刚开始学的时候都是使用这个脚手架吧。

使用这个脚手架挺适合新手的,零配置,执行该脚手架命令安装特定的模板,安装相关依赖包,通过执行 npm start 即可把项目运行起来。

但是这个脚手架在开发的过程中我要引入相对应的模块,例如要引入一个组件 import NiuBi from '../../../components/niubi.jsx',这个路径看起来就很丑,而且编写的时候极度困难,因此我们可以通过 Webpack 配置路径别名,可那时候我哪会配置 Webpack 啊,善于思考的我决定打开百度,发现可以使用 carco 配置 Webpack,但是发现 carco 版本和 react-script 版本并不兼容,因为这个问题把我折磨了一天,因此这个时刻我想自己去开源一个脚手架的想法从此诞生,虽然那时候的我技术非常菜,不过我现在的技术也菜,但是我胆子大啊!!!😏😏😏

所以在这里我总结一下 create-react-app 脚手架的一些缺点,但是这仅仅是个人观点:

• 难定制: 如果你需要自定义配置 Webpack,你需要额外使用第三方工具 carco 或者 eject 保留全部 Webpack 配置文件;
• 模板单一: 模板少而且简单,这意味着我们每次开发都要从零开始;

GitHub地址

寻找队友

到目前为止,脚手架的功能已经像模像样了,但是全程都是我一个人在开发,想做的功能很多,但是个人精力有限,例如我想要支持 vue 的功能,但是我没有学过 vue,想要添加又要额外去学习一下,真的是心有余力不足。

所以我希望可以在这里能找到一些喜欢瞎几把搞的朋友来一起开发,有事好商量。

未来做些什么(画饼)

• 逐步优化用户体验效果,编写更完美的使用文档;
• 添加对 vue 的支持;
• 提供单元测试;
• 增加更多的完美配置,减少用户对项目的额外配置;
• 添加更多的模板,例如后台管理系统;
• 将来会考虑开发一些配套的生态,例如组件库;
• 等等……

最后

本人是一个掘金的活跃用户,一天里可能就两三次上 GitHub,如果你联系不到我,如果你不想添加我微信好友你可以通过掘金里私信我,掘金私信有通知,如果我不忙,我可能很快就能回复到你。

如果该脚手架有什么问题或者有什么想法可以通过 Github 的 issue 给我留言。

如果觉得该项目对你有帮助,也欢迎你给个 star,让更多的朋友能看到。