首页 > 其他分享 >写一个自定义的脚手架的前奏

写一个自定义的脚手架的前奏

时间:2022-12-16 17:59:25浏览次数:74  
标签:fs const cli 自定义 前奏 文件夹 lsq path 脚手架

一直想写一个自己的脚手架,个人觉得脚手架核心就是输入命令行,然后各类的目录、文件、配置都给你自动生成好了,然后你直接开发业务就行,不需要进行过多的配置,总而言之,脚手架就是从已有的项目模板里复刻一份,然后在你执行命令的目录下生成这个项目,里面的目录文件就是那份模板的东西。

然后自己写了一个【simple-lsq-cli】,仓库地址:https://github.com/lishengqin/simple-lsq-cli,它实现的就是执行 【simple-lsq-cli】,然后会自动生成一个文件夹,文件夹里的内容就是复刻我的模板。

文件夹目录的格式如图下:

 

 

使用效果:

             

 

 

 1. bin/simple-lsq-cli.js

这个文件本质就是个脚本,它的逻辑就是首先让用户输入创建文件夹的名称,判断是否已存在这个文件夹,然后在目录下生成这个文件夹,然后再循环读取【template】这个目录下的文件,并将其写入到生成的文件夹里面去,最后呈现的效果就是我执行完命令行,我的目录下自动生成一个文件夹,文件夹里的内容自动读取我的一个模板也自动生成了。

ps:一定要注意,这个js的第一行,一定要加  #!/usr/bin/env node ,不然执行这个命令没有反应。

 

 

 2. package.json

bin里面可以写多个命令,每个命令指向对应的文件,然后全局安装后,执行每个命令,就相当于执行 【node 对应文件】。

配置可以改成私有,"private": true ,然后 【npm link】在本地发布,再【npx simple-lsq-cli 】使用。

 3. 附上 simple-lsq-cli.js 代码

 1 #!/usr/bin/env node
 2 import path from 'path';
 3 import fs from 'fs';
 4 import inquirer from 'inquirer';
 5 import { fileURLToPath } from 'url';
 6 const __filename = fileURLToPath(import.meta.url);
 7 const __dirname = path.dirname(__filename);
 8 const templateUrl = `../template`;
 9 function deleteFolder(filePath) {
10   let files = [];
11   if (fs.existsSync(filePath)) {
12     files = fs.readdirSync(filePath);
13     files.forEach(one => {
14       let currentPath = path.resolve(filePath, one);
15       if (fs.statSync(currentPath).isDirectory()) {
16         deleteFolder(currentPath);
17       } else {
18         fs.unlinkSync(currentPath);
19       }
20     });
21     fs.rmdirSync(filePath);
22   }
23 }
24 
25 const { dirName } = await inquirer.prompt([
26   {
27     name: 'dirName',
28     type: 'input',
29     message: '文件夹名称',
30   },
31 ]);
32 let toDirPath = path.resolve(process.cwd(), './' + dirName);
33 let exist = fs.existsSync(toDirPath);
34 if (exist) {
35   const { isCover } = await inquirer.prompt([
36     { type: 'confirm', name: 'isCover', message: `目录下已存在${dirName},是否覆盖` },
37   ]);
38   if (isCover) {
39     deleteFolder(toDirPath);
40     fs.mkdirSync(toDirPath);
41   }
42 } else {
43   fs.mkdirSync(toDirPath);
44 }
45 let files = fs.readdirSync(path.resolve(__dirname, templateUrl));
46 files.forEach(file => {
47   let originFileUrl = path.resolve(__dirname, templateUrl, file);
48   const data = fs.readFileSync(originFileUrl, 'utf-8');
49   fs.writeFileSync(path.resolve(toDirPath, file), data);
50 });
51 console.log(`${dirName}文件已生成!`);

 

标签:fs,const,cli,自定义,前奏,文件夹,lsq,path,脚手架
From: https://www.cnblogs.com/grow-up-up/p/16987361.html

相关文章

  • 文本分类学习 (五) 机器学习SVM的前奏-特征提取(卡方检验续集)
    前言:上一篇比较详细的介绍了卡方检验和卡方分布。这篇我们就实际操刀,找到一些训练集,正所谓纸上得来终觉浅,绝知此事要躬行。然而我在躬行的时候,发现了卡方检验对于文本分类来......
  • vue3自定义无限滚动
    最初使用的vue3-infinite-scroll-better插件进行滚动加载,打包部署后插件滚动功能失效了也不报错很难查找问题出现在哪部分,只好自己写一个相对简单的功能监控窗体的滚动......
  • 自定义导航栏
    UI对于导航栏有一些自己的想法,需要导航栏高度变高,需要加载Gif,需要按钮图标凸起,所以原本的导航栏就满足不了需求了,我们需要自定义UITabBar自定义导航栏......
  • Python 导入模块、文件、包、自定义路径包
    测试环境,假设:主文件绝对路径:/home/ubu/py_test/main.py模块文件:/home/ubu/py_test/con.py模块目录:/home/ubu/py_test/modules/tt.py模块目录:/home/ubu/py_test/modules......
  • 微信小程序ucharts、echarts层级太高,遮挡底部tabbar,或者遮挡自定义头部区域
    一般在开发者工具中正常显示,而在真机上则会遮挡,ucharts,echarts基于层级比tab高,调过两者的z-index是不生效的使用cover-view和cover-image标签 代替原来view和image标签......
  • 使用 System.Text.Json 时,如何处理 Dictionary 中 Key 为自定义类型的问题
    在使用System.Text.Json进行JSON序列化和反序列化操作时,我们会遇到一个问题:如何处理字典中的Key为自定义类型的问题。背景说明例如,我们有如下代码: //定义一个......
  • Android自定义日历源码收集
    概述以前在一家OA公司的时候,做的第一个项目便是日程模块,当时由于对OA理解的偏差,写了很多无用的代码和逻辑,也走了很多的弯路。几年过去了,现在回想起来还历历在目,今天给大家......
  • 自主搭建5个精品脚手架,玩转前端提效
    今日给大家带来的是前端脚手架的树立流程。我一定是参考了许多大佬的博客和相关视频来树立脚手架的。最后我本人做,才气融会贯穿。企业开展中的问题东西的呈现必然会处置这......
  • 创建脚手架详细步骤(以及过程中遇到问题)
    1.进入cmd2.输入:npmconfigsetregistryhttps://regitry.npm.taobao.org(出现下载比较慢所以先使用该命令)3.输入:npminstall-g@vue/cli4.如果要是遇到npm找不到的......
  • iOS分享扩展支持自定义联系人
    iOS分享扩展支持自定义联系人iOS可以通过添加ShareExtension来扩展系统的分享组件,能够支持将网页,图片,音乐或任何接入了系统分享组件功能的应用分享到我们自己的App内。分享......