网站自动秒收录工具,设计说明是什么意思,好看的网站界面设计,wordpress传入视屏黑屏全文3928字#xff0c;阅读时间 10分钟#xff0c;未来节约时间 15分钟/每天代码片段#xff08;code snippet#xff09; 相信大家都或多或少有接触过。在完成一个项目以后#xff0c;往往都会写出许多有价值的代码#xff0c;或是绞尽脑汁解决的难题#xff0c;或是灵… 全文3928字阅读时间 10分钟未来节约时间 15分钟/每天代码片段code snippet 相信大家都或多或少有接触过。在完成一个项目以后往往都会写出许多有价值的代码或是绞尽脑汁解决的难题或是灵光一现的小技巧又或是需要给组里的人分享经验分享代码。对于我而言我有时确实会把足够酷炫或者自豪的项目封装成一个包例如npm或者是nuget等等但面对粒度再小一点的一个function甚至是一行代码就不太合适了。我自己遇到困难的几个场景electron-builder 打包后为了修改electron国内镜像下载地址往往会配置vue.config.js。这个地址很长一段时间都不会变包括这个配置的结构等主要内容其实都不太会变每次要写的时候都会忘记在找了好一会之前写的代码后终于找到了之前的配置文件复制-粘贴我的vue项目中会使用vuetify而vuetify的各种配置都会写在一起说复杂也不复杂但我没有记每次都是用到的时候打开官网然后复制-粘贴还有一些其他配置文件例如 axiosechartsignalr等配置文件大部分情况下都不需要修改直接复制-粘贴....为了能够减少以上重复工作提高效率我也尝试过不少办法制作项目模板使用vue init 来初始化项目使用 github gist在vscode 中使用code snippet但以上的解决方案或多或少有些问题长期使用感觉不现实制作项目模板的话需要挺大的启动决心的并且投入大见效慢如果需要普适项目需要花大力气抽象而不普适有没有复用价值。去建设去维护一个项目模板是一件需要权衡的事情使用gist 呢我一直没有找到使用gist的正确姿势我可以很开心的写gist也可以很开心的看但 我如何使用呢打开网页搜索然后复制粘贴但这不又回去了没有简化太多使用code snippet 可以参看vscode官方文档如何书写snippets写起来说复杂也不复杂但是感觉维护和管理也是一个问题。而且那个body需要多行字符串导致书写的时候还得转换一次简单的还好复杂的肯定不能手写了吧。直到前几天我在vscode 插件市场里逛街的时候发现了一个还不错的gist书写工具 GistPadGistPad是一个Visual Studio Code扩展它允许您完全在编辑器中远程编辑GitHub Gist和存储库。您可以打开创建删除分叉和加星号信息库和存储库然后无缝地开始编辑文件就好像它们是本地文件一样而无需克隆推送或拉取任何内容。就像您自己的开发人员库一样它用于构建和引用代码段常用配置/脚本与编程相关的注释/文档知识库和交互式示例。用了几天以后觉得还挺好用的。虽然还没有到我的要求但 那至少我写gist方便很多了对吧。另外逛街的时候也发现网友和我有相同的问题呢要是能够又能够轻易的查看管理自己的gist又能在vscode中快速使用就好了啊。感觉也不是不行额好像是可以的哈其实只需要能够自动将gist自动转换为code-snippets文件就可以了哈GistSnippetGisnippet于是经过我的捣鼓gistsnippet的转换工具gisnippet就完成啦。0. 第一版在项目制作之初就决定写npm 全局包而不是vscode 插件。一方面是不带GUI稍微方便点另一方面是我偶尔也会用visual studio所以写个npm包方便在那边用另外提一句有点坑的是vscode 的snippet和vsstudio中的snippet竟然格式不一样。这个工具会访问github gist下载当前代码端的文件并且按照指定的代码段的格式来修改最后存储到当前工作区或者是全局代码段文件夹。项目依赖如下octokit/rest 来作为github gist的api 访问工具。chalk 来让控制台界面漂漂亮亮commander 来让控制台程序接受指令并提供帮助说明lowdb 来存储必要的信息例如登录数据commander-让程序接受指令利用commander能够很方便的创建交互式控制台程序command中amp;lt;amp;gt;表示必选参数,若用[]则表示必须参数图中展示了如何用一个函数响应命令行中的命令并打印出参数lowdb-爽快的数据持久化lowdb是一个建立在json文件上的极其简单的数据存储库。下图展示了如何使用其进行初始化以及简单的读写操作一开始需要有一段配置包括文件设置以及初始的json文件结构设置值同步到文件需要加上write()读取值,最后需要加上value()用起来还是非常简单爽快的哈chalk-让控制台程序也能漂漂亮亮像这样就能够让控制台输出红色的文本啦 一般用于警告报错之类的octokit/rest-js也能访问你的github啦初始化连接访问当前用户所有gist通过id来访问某一条gist组合以上几个工具gisnippet 就完成啦欢迎大家来starhttps://github.com/legenself/gisnippet安装方法npm install -g gisnippet使用方法$ gisnippet -h
# output
Usage: index [options] [command]Options:-v output the version number-g, --global localed your snippets (default: false)-f, --force force convert all your gist file to snippets (default: false)-h, --help display help for commandCommands:login token login with github tokenset key value set your vscode snippets settingssetting get your vscode snippets settingsglobalfolder folder set your vscode snippets foldersync id sync your gists to vscode snippets,if id is empty,mg will sync all your gistsshow show your gistshelp [command] display help for command首先需要登录你的github获取一个可以访问gist的token并登录gisnippet login yourtoken然后需要配置你的vscode 代码段路径 一般在这个目录下 C:\Users\yourname\AppData\Roaming\Code\User\snippetsgisnippet globalfolder folder使用show命令查看你当前的代码段gisnippet show使用sync id 来同步某个代码段gisnippet sync id [-g]加上-g 将安装到vscode全局目录否则将装在当前文件夹gist格式说明但是还存在问题我现在转换的是一条gist中的所有文件。这样就导致转换出来的code-snippet的触发输入只能用文件名来做但这样很不直观描述也没地方写所以我参考 generate-snippet库的格式利用yaml头来描述一条gist所含有的元数据一条gist的文件开头应该像这样标明 触发键描述作用文件这样就解决了配置触发输入和配置描述的问题不过为了兼容以前的版本加入了-f --force命令表示强制转换所有文件为code-snippets一个完整的示例是这样---
prefix: lowdb.get
description: lowdb获取数据
scope: javascript,typescript
---
js
db.get($1).value()
最后就是答应大家的福利啦为了让大家开发 有关lowdbcommandarchalkoctokit/rest相关的项目的时候少搜索几次这里提供了我总结出的项目片段。利用本文的gisnippet 就能够同步代码段到vscodeoctokit fff647ac21cf48dca9e96cd627329ecc 2020-10-19T13:13:42Z
- octokit.gist.md 205
- octokit.gists.md 180
- octokit.init.md 155
chalk deec6aa8df4c04bf28de65fddab145d3 2020-10-19T12:53:32Z
- chalk.blue.md 104
- chalk.red.md 101
- chalk.yellow.md 110
commander 2712af98e1ddffaef49bc8652e4201db 2020-10-19T12:46:00Z
- commandar.action.md 256
lowdb 5e0ecea015b9e23fea08170b7806a05d 2020-10-19T12:45:17Z
- lowdb.get.md 116
- lowdb.init.md 399
- lowdb.set.md 121
npm-cli-app f16a9659296be09ef05e0300c0b9de23 2020-10-19T12:46:01Z
- lowdb.get.md 117
- lowdb.init.md 399
- lowdb.set.md 121
- program.command.md 256
md a9859a37565dc0ff3666f1682af92d1e 2020-10-19T12:43:53Z
- gist-header.md 126看看安装好的样子我也能够很轻易的制作自己的代码段预计将省去我30%百度重复问题的时间保守估计15分钟起步吧相信应该也能够节省大家不少时间吧~如果本文有帮助到您的话欢迎点个赞喜欢 鼓励一下我哈哈哈哈哈那就再好不过了
