共享博客使用 degit 在 CLI 工具中下载模板
我在remotion源代码中发现了一个名为“degit”的文件。
remotion 可帮助您以编程方式制作视频。
在本文中，我们将了解以下概念：
- 什么是degit？
- 受 remotion 的 degit 文件启发，构建一个简单的 degit 函数
什么是数字？
我记得在开源的自述文件中看到过“degit”，但我不记得它是哪个存储库，所以我在谷歌上搜索了 degit 的含义并找到了这个 degit npm 包。
简单来说，您可以使用 degit 只需下载最新的提交即可快速复制 github 存储库
而不是整个 git 历史记录。
访问 degit 官方 npm 包以了解有关此包的更多信息。
您也可以使用此 degit 包从 gitlab 或 bitbucket 下载存储库，因此它不仅限于 github 存储库。
# download from gitlabdegit gitlab:user/repo# download from bitbucketdegit bitbucket:user/repodegit user/repo# these commands are equivalentdegit github:user/repo
这是 javascript 中的示例用法：
const degit = require('degit');const emitter = degit('user/repo', { cache: true, force: true, verbose: true,});emitter.on('info', info => { console.log(info.message);});emitter.clone('path/to/dest').then(() => { console.log('done');});受 remotion 的 degit 文件启发，构建一个简单的 degit 函数
要了解如何构建简单的 degit 函数，让我们分解 remotion 的 degit.ts 文件中的代码。该文件实现了 degit npm 包的基本版本：获取 github 存储库的最新状态，而不下载完整的历史记录。
1.使用进口
import https from 'https';import fs from 'node:fs';import {tmpdir} from 'node:os';import path from 'node:path';import tar from 'tar';import {mkdirp} from './mkdirp';2：获取存储库
export function fetch(url: string, dest: string) { return new promise<void>((resolve, reject) => { https.get(url, (response) => { const code = response.statuscode as number; if (code >= 400) { reject( new error( `network request to ${url} failed with code ${code} (${response.statusmessage})`, ), ); } else if (code >= 300) { fetch(response.headers.location as string, dest) .then(resolve) .catch(reject); } else { response .pipe(fs.createwritestream(dest)) .on('finish', () => resolve()) .on('error', reject); } }).on('error', reject); });}</void>3：提取存储库
下载存储库后，需要提取tarball的内容：
function untar(file: string, dest: string) { return tar.extract( { file, strip: 1, c: dest, }, [], );}4：把它们放在一起
主要 degit 函数将所有内容联系在一起，处理目录创建、获取和提取存储库：
export const degit = async ({ repoorg, reponame, dest,}: { repoorg: string; reponame: string; dest: string;}) => { const base = path.join(tmpdir(), '.degit'); const dir = path.join(base, repoorg, reponame); const file = `${dir}/head.tar.gz`; const url = `https://github.com/${repoorg}/${reponame}/archive/head.tar.gz`; mkdirp(path.dirname(file)); await fetch(url, file); mkdirp(dest); await untar(file, dest); fs.unlinksync(file);};mkdirp 用于创建
递归地目录。
结论：
我发现remotion在你运行安装命令时使用degit来下载模板：
npx create-video@latest
这个命令要求你选择一个模板，这就是degit开始下载的地方
所选模板的最新提交
您可以从create-video包中查看此代码作为证明。
获得受开源最佳实践启发的免费课程。关于我：
网站：https://ramunarasinga.com/
linkedin：https://www.linkedin.com/in/ramu-narasinga-189361128/
github：https://github.com/ramu-narasinga
邮箱：ramu.narasinga@gmail.com
学习开源中使用的最佳实践。
参考：
- https://github.com/rich-harris/degit
- https://github.com/remotion-dev/remotion/blob/main/packages/create-video/src/degit.ts
- https://github.com/remotion-dev/remotion/blob/c535e676badd055187d1ea8007f9ac76ab0ad315/packages/create-video/src/init.ts#l109
- https://github.com/remotion-dev/remotion/blob/main/packages/create-video/src/mkdirp.ts
-
JavaScript如何获取宏控件数据？
javascript 获取宏控件数据的方法有两种：get("value")：获取输入框、文本区域和选择列表的 value...
JavaScript
2个月前 (10-15) 88 -
JavaScript怎样读取宏控件数据？
是的，可通过以下步骤读取宏控件数据：获取宏控件元素检查宏控件类型（例如，activex 或 java 插件）获取宏控件对...
JavaScript
2个月前 (10-15) 82 -
JavaScript获取宏控件数据的技巧
用 javascript 获取宏控件数据包含以下步骤：获取宏控件对象。获取宏控件属性，如 classid。执行宏控件方法...
JavaScript
2个月前 (10-15) 81 -
探究JavaScript与Java的联系和区别
javascript 和 java 虽然名称相似，但它们是两种截然不同的语言，主要区别在于：1. 语法不同；2. 编译方...
JavaScript
2个月前 (10-15) 80 -
javascript:void(o)如何解决？
解决 javascript:void(o) 错误的步骤：检查链接是否指向预期脚本。使用文本编辑器或 javascript...
JavaScript
2个月前 (10-15) 89