前言
随着前端技术的发展,越来越多的工具和库被开发出来,方便着我们开发与维护。而 npm 作为前端最常见的包管理工具,为我们提供了非常方便的方式来管理我们的项目依赖。
在这篇文章中,我们将介绍一个npm 包 hand-cli,它可以帮助我们快速生成项目的脚手架,并提供了相应的工具来加速开发过程。
hand-cli 地址
安装
在开始之前,请确保你已经安装了 Node.js (建议版本 8.0 及以上)和 npm(建议版本 3.0 及以上)。
使用 npm 安装 hand-cli:
npm i hand-cli -g
使用
初始化项目
使用 hand init <project-name>
命令可以快速生成一个项目的脚手架。比如我们创建一个名称为 my-project
的项目:
hand init my-project
然后按照提示依次选择项目类型、UI 组件库、项目配置等选项即可生成项目的脚手架。
项目命令
进入到项目目录,使用 npm run dev
命令可以启动本地开发服务器。使用 npm run build
命令可以生成项目的构建版本。
工具模块
hand-cli 还提供了一些工具模块,可以在开发过程中帮助我们更快速的完成一些常见任务。
创建组件
使用 hand create <component-name>
命令可以快速生成一个组件,并默认创建相应的样式和测试文件:
hand create my-component
这样就可以自动生成如下文件结构:
src/ components/ my-component/ index.js index.less index.test.js
生成页面
使用 hand generate page <page-name>
命令可以创建一个新的页面。
hand generate page my-page
这样就会自动生成如下文件结构:
-- -------------------- ---- ------- ---- ------ ------- -------- ---------- ------------- ------------ --------- ----------
扩展手动配置
hand-cli 也可以自动生成相应的项目配置文件,比如 .babelrc
、.eslintrc
、.stylelintrc
等,如果需要进一步定制,可以手动修改这些配置文件,并重新运行相应的命令。
结语
手动搭建脚手架一直是一个比较繁琐的事情,使用 hand-cli 可以帮助我们快速生成项目的脚手架,并提供了很多工具模块来帮助我们更加高效的开发。如果你想快速搭建一个前端项目,并且还希望有完善的工具支持,那么 hand-cli 就是你的不二选择。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/600671d730d0927023822e21