网站首页 > 技术文章 正文
自主搭建5个精品脚手架,玩转前端提效
下栽地止:https://www.666xit.com/3796/
覆盖前端研发全流程环节,可通用、可复用
当下的前端开发,离不开脚手架。初级前端需会用脚手架,中高级前端应能够开发脚手架——掌握脚手架,就是贯穿初中高级前端生涯的核心竞争力之一。本课程集中讲解脚手架的设计思路和开发实践,并带你实现5个不同的脚手架项目,助力前端全流程提效,塑造个人竞争优势。
为什么需求脚手架?
脚手架本质上是一种东西,使用脚手架的意图是为了脱节制作一个项意图重复性作业,特别是当一个项目具有一定的通用性时,工程脚手架的含义更加杰出。它允许咱们只用一行指令来初始化一个项目,而不是做比方装备环境、装置依靠项和解决依靠项抵触之类的顺便使命。咱们能够直接进入主使命,早点下班~ ~
概述
要开发新的脚手架,一般需求以下npm包:
commander:node的强壮指令行处理东西。能够很简单的得到指令行的参数。
Inquirer:一个指令行交互东西,让你以“一问一答”的交互方法完结一系列指令行操作。
Download-git-repo: git资源库下载东西,一般用于下载模板代码。
Ora:终端加载美化东西。
粉笔:指令行输入/输出美化东西。假如你想要一个丰富多彩的指令行版别,就挑选它。
车把:模板引擎
完成的功用:
一个简单的指令初始化项目。
提供友爱的交互体验。
您能够挑选装置不同的模板。
自动装置项目依靠项
在package.json中增加一个bin字段。在装置过程中,npm会将文件符号链接到前缀/bin,用于全局装置或。/node_modules/。bin/本地装置。这样就能够全球通用了。比方下面以meo-cli为指令名,可履行文件为根目录的index.js。
这是为什么呢?由于咱们还没有装置相应的包,当然不会链接到全球。一种办法是外包出去,然后在本地装置。但是太麻烦了。每次调试都要外包吗??
有没有更优雅的方法?答案是:npm早就想好了对策,就是npm link,能够把指定的履行文件链接到全局情况,用起来也很简单。它在项意图根目录中履行:
npm链接
去做吧。假如履行该指令后,显现类似“装置npm软件包”的提示,则意味着链接成功。履行meo-cli后,您能够看到令人欣慰的hello world。留意这里第一行的代码。
Commander的用法如下:。command ('init [name]',' init a project ',OPTS)函数:注册一个指令。
第一个参数:set指令的称号,后面能够跟参数,表明必需参数,[]表明可选参数。
第二个参数:指令的描绘,可选。留意,当有第二个参数时,不能显现的调用动作作为指令的回调,需求单独的可履行文件作为指令。
第三个参数:装备参数,如noHelp、isDefault等。选项('-n,-name | [name]',' desc ',' GK ')
功用:定义指令选项,(附加参数,如指令,用于辅佐指令)
。描绘(“这是desc的指令”)
功用:指令的描绘将应用于指令的帮助信息,在使用帮助指令时显现。
。action(cb):指令的回调函数
猜你喜欢
- 2025-05-26 Wee – 为现代 Web 开发打造的 CSS 脚手架
- 2025-05-26 中建工地高颜值的“秘诀”:盘扣式外架+定型化网片
- 2025-05-26 你没见过的新型花篮外架技术更快捷更方便,值得推广
- 2025-05-26 图解:盘扣式脚手架搭建步骤
- 2025-05-26 收藏!2022最新工字钢悬挑脚手架做法和规范,萌新必看
- 2025-05-26 「架构师必备」基于SpringCloud的SaaS型微服务脚手架
- 2025-05-26 使用 Vue 脚手架,为什么要学 webpack?(一)
- 2025-05-26 新型梁侧预埋式外脚手架连墙件施工工艺和流程
- 2025-05-26 SpringBoot+LayUI后台管理系统开发脚手架
- 2025-05-26 推荐一款超棒的SpringCloud 脚手架项目
你 发表评论:
欢迎- 最近发表
- 标签列表
-
- 前端设计模式 (75)
- 前端性能优化 (51)
- 前端模板 (66)
- 前端跨域 (52)
- 前端缓存 (63)
- 前端react (48)
- 前端aes加密 (58)
- 前端脚手架 (56)
- 前端md5加密 (49)
- 前端路由 (55)
- 前端数组 (65)
- 前端定时器 (47)
- Oracle RAC (73)
- oracle恢复 (76)
- oracle 删除表 (48)
- oracle 用户名 (74)
- oracle 工具 (55)
- oracle 内存 (50)
- oracle 导出表 (57)
- oracle 中文 (51)
- oracle链接 (47)
- oracle的函数 (57)
- mac oracle (47)
- 前端调试 (52)
- 前端登录页面 (48)
本文暂时没有评论,来添加一个吧(●'◡'●)