首页 > web前端 > js教程 > 正文

使用 degit 在 CLI 工具中下载模板。

王林
发布: 2024-08-17 06:51:32
原创
650 人浏览过

我在Remotion源代码中发现了一个名为“degit”的文件。
Remotion 可帮助您以编程方式制作视频。

在本文中,我们将介绍以下概念:

  1. 什么是数字?
  2. 受 Remotion 的 degit 文件启发,构建一个简单的 degit 函数

什么是数字?

我确实记得在开源自述文件之一中提到过“degit”,但我不记得它是哪个存储库,所以我用谷歌搜索了 degit 的含义并找到了这个 degit npm 包。

简单来说,您可以使用 degit 只需下载最新的提交即可快速复制 Github 存储库
而不是整个 git 历史记录。

访问 degit 的官方 npm 包以了解有关此包的更多信息。

您也可以使用此 degit 包从 Gitlab 或 Bitbucket 下载存储库,因此它不仅限于 Github 存储库。

# download from GitLab
degit gitlab:user/repo

# download from BitBucket
degit bitbucket:user/repo

degit user/repo
# these commands are equivalent
degit 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';
登录后复制
  • https:用于发出网络请求以获取存储库。
  • fs:与文件系统交互,例如写入下载的文件。
  • tmpdir:提供系统的临时目录路径。
  • path:处理和转换文件路径。
  • tar:提取 tarball(压缩文件)的内容。
  • 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);
    });
}
登录后复制
  • URL处理:该函数检查请求是否成功(状态代码低​​于300)。 如果是重定向(代码在 300 到 399 之间),它将遵循新的 URL。 如果是错误(代码 400+),则拒绝承诺。
  • 文件保存:使用 fs.createWriteStream 下载存储库并将其保存到目标路径。

3:提取存储库

下载存储库后,需要提取压缩包的内容:

function untar(file: string, dest: string) {
    return tar.extract(
        {
            file,
            strip: 1,
            C: dest,
        },
        [],
    );
}
登录后复制
  • Tar 提取:此函数将 .tar.gz 文件的内容提取到指定的目标目录。

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 包中检查此代码作为证明。

Use degit to download a template in your CLI tool.

获取受开源最佳实践启发的免费课程。

关于我:

网站:https://ramunarasinga.com/

Linkedin:https://www.linkedin.com/in/ramu-narasinga-189361128/

Github:https://github.com/Ramu-Narasinga

电子邮件:ramu.narasinga@gmail.com

了解开源中使用的最佳实践。

参考:

  1. https://github.com/Rich-Harris/degit
  2. https://github.com/remotion-dev/remotion/blob/main/packages/create-video/src/degit.ts
  3. https://github.com/remotion-dev/remotion/blob/c535e676badd055187d1ea8007f9ac76ab0ad315/packages/create-video/src/init.ts#L109
  4. https://github.com/remotion-dev/remotion/blob/main/packages/create-video/src/mkdirp.ts

以上是使用 degit 在 CLI 工具中下载模板。的详细内容。更多信息请关注PHP中文网其他相关文章!

来源:dev.to
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板