搭建属于自己的 业务脚手架(Type 1-简陋版)

本文记录了如何基于公司的日常业务需求,利用Node.js创建一个自定义的模板脚手架。内容包括所需库的介绍、本地项目的搭建、对接内部仓库的准备,以及发布到npm的过程。作者指出,此脚手架适用于Vue、React、Angular等前端框架,并鼓励读者在遇到不同意见时留言讨论。
摘要由CSDN通过智能技术生成

重复的事,我将她归结于 “轮子”

日常业务的琐事,为了后续减少开发以及维护成本,这里记录一次 基于公司业务的模板脚手架(架构内容还是纯碎的vue、react、angular 等框架),经过node的加工打造(很早以前写的草稿今天翻出来先晾一晾,目测有蛮多东西会引起各位“码油”的不认同,当然有问题欢迎留言,我们一起探讨哈)

首先

  • 需要的库
  • 搭建本地项目
  • 对接仓库(仓库为日常工作要用的基础代码,后篇文章会谈到)
  • 发布npm(此步骤前先拥有npm账号,后篇文章会谈到)
  • 使用测试(发布完成后,我们npm 全局安装进行创建一个工程,后篇会谈到)
  • 结语(未完待续)

需要的库:

"dependencies": {
   
    "chalk": "^3.0.0", //颜色输出,你也可以使用 color-console
    "commander": "^5.0.0", // node.js 的命令行 交互 (类似 vue -V 、 vue -H)
    "download-git-repo": "^3.0.2", // node.js拉取线上仓库的插件
    "inquirer": "^7.1.0", // node.js 命令行操作 交互 (类似 vue create XXX 后 让你选择的操作)
    "ora": "^4.0.3" // node.js 终端加载动画效果
  }

搭建本地项目
① 创建文件夹工程名自定义:air-cli(这里我随便取)
② bin:整个cli的所有操作书写的地方
③ template: 一会用于用户创建模板所存的 配置文件夹
创建属于自己的项目文件夹(这里以 ① 为例)

  • 在项目文件夹中 初始化 package.json 一键回车到底
  • 新建bin和template两个文件夹目录
  • 在bin目录中创建你要的指令(文件):
    cli.js //入口
    cli-add.js // 初始化
    cli-init.js  // 添加
    cli-del.js  // 移除 这里没书写,下期补齐
    cli-watch.js // 查询
  • 上述的指令,一会都在package.json文件 中的 bin脚本中进行添加

注意第一行的代码 一定要写,下列这个写法是让程序自寻找你安装好的node环境地址,网上也有很详细的解释

  • cli.js
#!/usr/bin/env node

const proSystem = require("commander");
proSystem
  .version(require("../package").version)
  .usage("<templat> [options]")
  .command("add", "引用一个新的模板仓库")
  .command("init", "初始化你的项目")
  .command("watch", "查看脚手架的模板仓库");
// 解析命令行参数
proSystem.parse(process.argv);
  • cli-add.js:
#!/usr/bin/env node

// 交互命令 插件
const inquirer = require("inquirer");
// 修改控制台字符串的样式
const chalk = require("chalk");
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Air hang

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值