Maison > interface Web > js tutoriel > le corps du texte

Utilisez degit pour télécharger un modèle dans votre outil CLI.

王林
Libérer: 2024-08-17 06:51:32
original
651 Les gens l'ont consulté

J'ai trouvé un fichier nommé "degit" dans le code source de Remotion.
Remotion vous aide à créer des vidéos par programmation.

Dans cet article, nous examinerons les concepts suivants :

  1. Qu'est-ce que Degit ?
  2. Créez une fonction degit simple inspirée du fichier degit de Remotion

Qu’est-ce que le Degit ?

Je me souviens avoir vu "degit" mentionné dans l'un des Readmes de l'open source, mais je ne me souvenais pas de quel référentiel il s'agissait, alors j'ai cherché sur Google ce que signifie un degit et j'ai trouvé ce package npm degit.

En termes simples, vous pouvez utiliser degit pour faire rapidement une copie d'un référentiel Github en téléchargeant uniquement le dernier commit
au lieu de l'intégralité de l'historique de git.

Visitez le package npm officiel pour degit pour en savoir plus sur ce package.

Vous pouvez également utiliser ce package degit pour télécharger des dépôts depuis Gitlab ou Bitbucket, donc ce n'est pas limité aux référentiels 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
Copier après la connexion

Voici un exemple d'utilisation en 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');
});
Copier après la connexion

Créez une fonction degit simple inspirée du fichier degit de Remotion

Pour comprendre comment créer une fonction degit simple, décomposons le code du fichier degit.ts de Remotion. Ce fichier implémente une version de base de ce que fait le package degit npm : récupérer le dernier état d'un référentiel GitHub sans télécharger l'historique complet.

1. Importations utilisées

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';
Copier après la connexion
  • https : utilisé pour faire une requête réseau pour récupérer le référentiel.
  • fs : interagit avec le système de fichiers, par exemple en écrivant les fichiers téléchargés.
  • tmpdir : fournit le chemin du répertoire temporaire du système.
  • path : gère et transforme les chemins de fichiers.
  • tar : extrait le contenu de l'archive tar (fichier compressé).
  • mkdirp : Une fonction d'assistance pour créer des répertoires de manière récursive, fournie dans un fichier séparé.

2 : Récupérer le référentiel

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);
    });
}
Copier après la connexion
  • Gestion des URL : la fonction vérifie si la demande est réussie (codes d'état inférieurs à 300). S’il s’agit d’une redirection (codes entre 300 et 399), elle suit la nouvelle URL. S'il s'agit d'une erreur (codes 400+), il rejette la promesse.
  • Enregistrement de fichiers : le référentiel est téléchargé et enregistré dans le chemin de destination à l'aide de fs.createWriteStream.

3 : Extraction du référentiel

Après avoir téléchargé le référentiel, il est nécessaire d'extraire le contenu de l'archive tar :

function untar(file: string, dest: string) {
    return tar.extract(
        {
            file,
            strip: 1,
            C: dest,
        },
        [],
    );
}
Copier après la connexion
  • Extraction Tar : Cette fonction extrait le contenu du fichier .tar.gz dans le répertoire de destination spécifié.

4 : Mettre tout cela ensemble

La fonction principale degit relie tout ensemble, gérant la création de répertoires, la récupération et l'extraction du référentiel :

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);
};
Copier après la connexion

mkdirp est utilisé pour créer
un répertoire de manière récursive.

Conclusion:

J'ai découvert que Remotion utilise degit pour télécharger des modèles lorsque vous exécutez leur commande d'installation :

npx create-video@latest
Copier après la connexion

Cette commande vous demande de choisir un modèle, c'est là que degit entre en action pour télécharger
le dernier commit du modèle sélectionné

Vous pouvez vérifier ce code dans le package create-video pour preuve.

Use degit to download a template in your CLI tool.

Obtenez des cours gratuits inspirés des meilleures pratiques utilisées en open source.

Sur moi:

Site Internet : https://ramunarasinga.com/

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

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

Email : ramu.narasinga@gmail.com

Découvrez les meilleures pratiques utilisées en open source.

Références :

  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

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:dev.to
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal