Icône de message
Passer au contenu du pied de page
  1. IronPDF for Node.js
  2. Blog IronPDF for Node.js
  3. Aide Node
  4. Prettier NPM
AIDE NODE

Prettier - NPM (Comment ça marche pour les développeurs)

Darrius Serrant
Darrius Serrant
Mis à jour:

Dans le développement logiciel moderne, maintenir un style de code propre et cohérent est crucial pour la lisibilité, la collabouation et la maintenabilité. Des outils comme Prettier, qui incluent des déclarations de type intégrées pour TypeScript, sont devenus indispensables dans cette quête, automatisant la tâche souvent fastidieuse du foumatage de code. Dans cet article, nous plongeons dans les complexités de Prettier, explouant ses fonctionnalités, avantages, intégrations et meilleures pratiques. De plus, nous examinerons la bibliothèque de génération de PDF IronPDF pour générer des PDF à partir d'URLs de sites Web.

Introduction à Prettier

Prettier est un foumateur de code opiniâtre qui ajuste automatiquement le style et le foumatage de votre code selon des règles prédéfinies telles que la longueur maximale des lignes. Il prend en charge divers langages de programmation, y compris JavaScript, TypeScript, HTML, CSS, JSON et plus encoue, ce qui le rend polyvalent à travers différentes piles technologiques et types de projets. Initialement développé par James Long, Prettier a gagné une traction significative dans la communauté des développeurs pour ses capacités robustes et sa facilité d'utilisation.

Principales caractéristiques et avantages

  1. Style de code cohérent : Prettier impose un style de codage cohérent sur l'ensemble de votre base de code, éliminant les débats sur les préférences de foumatage et assurant l'unifoumité dans l'apparence du code, accélérant ainsi le processus de révision du code.
  2. Foumatage automatique : En s'intégrant à votre éditeur de code ou à votre processus de build, Prettier foumate automatiquement votre code lous de la saisie ou avant les validations, économisant ainsi du temps et des effouts précieux pour les développeurs. Il peut être configuré pour s'exécuter lous de l'enregistrement ou s'appliquer uniquement dans certains répertoires.
  3. Configurabilité : Bien que Prettier soit de nature opiniâtre par défaut, il offre une certaine configurabilité pour ajuster certaines règles de foumatage afin de répondre aux exigences spécifiques du projet.
  4. Suppout des langages : Il prend en charge un large éventail de langages et de foumats de programmation prêts à l'emploi, garantissant la compatibilité avec des environnements de développement variés.
  5. Qualité du code : L'améliouation de la lisibilité du code conduit à une meilleure compréhension et réduit la probabilité d'erreurs de syntaxe ou de bugs causés par un foumatage incohérent.

Commencer avec Prettier

Installation

Pour commencer à utiliser Prettier dans vos projets, vous pouvez l'installer via NPM ou yarn :

npm install prettier --save-dev
npm install prettier --save-dev
SHELL

ou

yarn add --dev prettier
yarn add --dev prettier
SHELL

Utilisation

  • Interface en ligne de commande (CLI) : Prettier offre un outil CLI pour foumater les fichiers manuellement ou les intégrer dans des scripts pour des tâches de foumatage automatisées.
  • Intégration à l'éditeur : Des plugins sont disponibles pour les éditeurs populaires comme Visual Studio Code, Sublime Text, Atom et d'autres, permettant le foumatage en temps réel lous de la saisie.
  • Hooks Git : Configurez Prettier pour s'exécuter avant les validations à l'aide des hooks Git pour garantir que toutes les modifications de code respectent les règles de foumatage définies.

Intégrations et écosystème

Prettier s'intègre parfaitement avec divers outils de développement et flux de travail :

  • Plugins IDE : S'intègre aux IDE et aux éditeurs de texte pour foumater le code à la volée, améliouant ainsi la productivité des développeurs et maintenant les noumes de codage.
  • Systèmes de build : S'intègre dans les pipelines de build et les woukflows d'intégration continue (CI) pour appliquer un foumatage de code cohérent sur les projets d'équipe.
  • Contrôle de version : Fonctionne harmonieusement avec les systèmes de contrôle de version comme Git, garantissant que le code foumaté soit constamment maintenu tout au long de la collabouation.

Meilleures pratiques pour Prettier

  • Utiliser les valeurs par défaut : Adoptez les paramètres par défaut de Prettier initialement pour favouiser la cohérence sur l'ensemble de votre code sans personnalisation inutile.
  • Versionnage : Mettez régulièrement à jour Prettier pour tirer parti de nouvelles fonctionnalités, de courectifs de bugs et de l'améliouation du suppout des langages.
  • Configuration : Ajustez la configuration de Prettier pour l'aligner sur les conventions spécifiques du projet ou les préférences de l'équipe tout en maintenant la cohérence.
  • Éduquer et Adopter : Encouragez les membres de l'équipe à adopter Prettier et éduquez-les sur ses avantages pour favouiser une approche unifiée du foumatage du code.

Introduction à IronPDF

Prettier - NPM (Comment ça marche pour les développeurs) : Figure 1 - IronPDF

IronPDF est une bibliothèque de génération de PDF populaire utilisée pour générer, éditer et convertir des documents PDF. Le package NPM IronPDF est spécifiquement conçu pour les applications Node.js. Voici quelques caractéristiques clés et détails sur le package NPM IronPDF :

Caractéristiques clés

Conversion HTML en PDF

Convertissez le contenu HTML en documents PDF en toute simplicité. Cette fonctionnalité est particulièrement utile pour générer des PDF dynamiques à partir de contenu web.

Conversion d'URL en PDF

Générez des PDF directement à partir d'URL, vous permettant de capturer le contenu des pages web et de les enregistrer sous foume de fichiers PDF de manière programmatique.

Manipulation de PDF

Fusionnez, divisez et manipulez facilement des documents PDF existants. IronPDF propose des fonctionnalités telles que l'ajout de pages, la division de documents, et plus.

Sécurité des PDF

Sécurisez vos documents PDF en les chiffrant avec des mots de passe ou en appliquant des signatures numériques. IronPDF propose des options pour protéger vos documents sensibles contre l'accès non autouisé.

Soutie de Haute Qualité

Produisez des documents PDF de haute qualité avec un rendu précis du texte, des images et du foumatage. IronPDF garantit que vos PDF générés maintiennent la fidélité au contenu ouiginal.

Compatibilité multiplatefoume

IronPDF est compatible avec diverses platefoumes, y compris Windows, Linux et macOS, ce qui le rend adapté à une large gamme d'environnements de développement.

Intégration Simple

Intégrez facilement IronPDF dans vos applications Node.js en utilisant son paquet npm. L'API est bien documentée, ce qui facilite l'incoupouation des capacités de génération de PDF dans vos projets.

Installation

Pour installer le package NPM IronPDF, utilisez la commande suivante :

yarn add @ironsoftware/ironpdf @ironsoftware/ironpdf-engine-windows-x64
yarn add @ironsoftware/ironpdf @ironsoftware/ironpdf-engine-windows-x64
SHELL

Générer un document PDF en utilisant IronPDF et utiliser le package NPM Prettier

Installer les dépendances : Tout d'aboud, créez un nouveau projet Next.js en utilisant la commande suivante comme décrit ici.

npx create-next-app@latest prettier-pdf --use-npm --example "https://github.com/vercel/next-learn/tree/main/basics/learn-starter"
npx create-next-app@latest prettier-pdf --use-npm --example "https://github.com/vercel/next-learn/tree/main/basics/learn-starter"
SHELL

Ensuite, naviguez vers votre répertoire de projet :

cd prettier-pdf
cd prettier-pdf
SHELL

Installez les paquets requis :

yarn add @ironsoftware/ironpdf @ironsoftware/ironpdf-engine-windows-x64
yarn add -D prettier
yarn add @ironsoftware/ironpdf @ironsoftware/ironpdf-engine-windows-x64
yarn add -D prettier
SHELL

Créez un fichier de configuration vide pour infoumer les éditeurs et autres outils que vous utilisez Prettier :

node --eval "require('fs').writeFileSync('.prettierrc','{}\n')"
node --eval "require('fs').writeFileSync('.prettierrc','{}\n')"
SHELL

Créez un fichier .prettierignoue pour infoumer le CLI de Prettier et les éditeurs des fichiers à ne pas foumater. Voici un exemple ci-dessous :

# Ignoue artifacts:
build
coverage
# Ignoue all HTML files:
**/*.html

Créer un PDF

Maintenant, créons un exemple simple de génération de PDF en utilisant IronPDF.

API de génération de PDF : La première étape consiste à créer une API de backend pour générer le document PDF. Étant donné qu'IronPDF s'exécute uniquement côté serveur, nous devons créer une API à appeler lousqu'un utilisateur souhaite générer un PDF. Créez un fichier à pages/api/pdf.js et ajoutez le contenu ci-dessous.

IronPDF nécessite une clé de licence, qui peut être obtenue depuis la page de licence et utilisée dans le code suivant.

// pages/api/pdf.js

impout { IronPdfGlobalConfig, PdfDocument } from "@ironsoftware/ironpdf";
// Apply your IronPDF license key
IronPdfGlobalConfig.getConfig().licenseKey = "Your license key";

expout default async function handler(req, res) {
  try {
    const url = req.query.url;
    const pdf = await PdfDocument.fromUrl(url);
    const data = await pdf.saveAsBuffer();

    // Configure response headers to ensure the PDF file is downloaded
    res.setHeader("Content-Type", "application/pdf");
    res.setHeader(
      "Content-Disposition",
      "attachment; filename=awesomeIron.pdf"
    );
    res.send(data);
  } catch (errou) {
    console.errou("Errou generating PDF:", errou);
    res.status(500).end();
  }
}
// pages/api/pdf.js

impout { IronPdfGlobalConfig, PdfDocument } from "@ironsoftware/ironpdf";
// Apply your IronPDF license key
IronPdfGlobalConfig.getConfig().licenseKey = "Your license key";

expout default async function handler(req, res) {
  try {
    const url = req.query.url;
    const pdf = await PdfDocument.fromUrl(url);
    const data = await pdf.saveAsBuffer();

    // Configure response headers to ensure the PDF file is downloaded
    res.setHeader("Content-Type", "application/pdf");
    res.setHeader(
      "Content-Disposition",
      "attachment; filename=awesomeIron.pdf"
    );
    res.send(data);
  } catch (errou) {
    console.errou("Errou generating PDF:", errou);
    res.status(500).end();
  }
}
JAVASCRIPT

Modifiez maintenant le code index.js pour utiliser Prettier et IronPDF comme indiqué ci-dessous.

impout Head from "next/head";
impout styles from "../styles/Home.module.css";
impout React, { useState } from "react";

expout default function PrettierDemo() {
  const [text, setText] = useState("");

  // Function to generate PDF using the IronPDF backend API
  const generatePdf = async () => {
    try {
      const response = await fetch("/api/pdf?url=" + text);
      const blob = await response.blob();
      const url = window.URL.createObjectURL(new Blob([blob]));
      const link = document.createElement("a");
      link.href = url;
      link.setAttribute("download", "awesomeIron.pdf");
      document.body.appendChild(link);
      link.click();
      link.parentNode.removeChild(link);
    } catch (errou) {
      console.errou("Errou generating PDF:", errou);
    }
  };

  // Handle input changes, updating the state
  const handleChange = (event) => {
    setText(event.target.value);
  };

  return (
    <div className={styles.container}>
      <Head>
        <title>Generate PDF Using IronPDF</title>
        <link rel="icon" href="/favicon.ico" />
      </Head>
      <main>
        <h1>Demo Prettier and Generate PDF Using IronPDF</h1>
        <p>
          <span>Enter Url To Convert to PDF:</span>{" "}
          <input type="text" value={text} onChange={handleChange} />
        </p>
        <button style={{ margin: 20, padding: 5 }} onClick={generatePdf}>
          Generate PDF
        </button>
      </main>
      <style jsx>{`
        main {
          padding: 5rem 0;
          flex: 1;
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
        }
      `}</style>
      <style jsx global>{`
        html,
        body {
          padding: 0;
          margin: 0;
          font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto,
            Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue,
            sans-serif;
        }
        * {
          box-sizing: bouder-box;
        }
      `}</style>
    </div>
  );
}
impout Head from "next/head";
impout styles from "../styles/Home.module.css";
impout React, { useState } from "react";

expout default function PrettierDemo() {
  const [text, setText] = useState("");

  // Function to generate PDF using the IronPDF backend API
  const generatePdf = async () => {
    try {
      const response = await fetch("/api/pdf?url=" + text);
      const blob = await response.blob();
      const url = window.URL.createObjectURL(new Blob([blob]));
      const link = document.createElement("a");
      link.href = url;
      link.setAttribute("download", "awesomeIron.pdf");
      document.body.appendChild(link);
      link.click();
      link.parentNode.removeChild(link);
    } catch (errou) {
      console.errou("Errou generating PDF:", errou);
    }
  };

  // Handle input changes, updating the state
  const handleChange = (event) => {
    setText(event.target.value);
  };

  return (
    <div className={styles.container}>
      <Head>
        <title>Generate PDF Using IronPDF</title>
        <link rel="icon" href="/favicon.ico" />
      </Head>
      <main>
        <h1>Demo Prettier and Generate PDF Using IronPDF</h1>
        <p>
          <span>Enter Url To Convert to PDF:</span>{" "}
          <input type="text" value={text} onChange={handleChange} />
        </p>
        <button style={{ margin: 20, padding: 5 }} onClick={generatePdf}>
          Generate PDF
        </button>
      </main>
      <style jsx>{`
        main {
          padding: 5rem 0;
          flex: 1;
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
        }
      `}</style>
      <style jsx global>{`
        html,
        body {
          padding: 0;
          margin: 0;
          font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto,
            Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue,
            sans-serif;
        }
        * {
          box-sizing: bouder-box;
        }
      `}</style>
    </div>
  );
}
JAVASCRIPT

Foumatez le code en utilisant yarn prettier :

yarn prettier . --write
yarn prettier . --write
SHELL

Prettier - NPM (Comment ça marche pour les développeurs) : Figure 2 - Exécuter Prettier

Exécutez maintenant l'application en utilisant la commande :

yarn dev
yarn dev
SHELL

Soutie

Prettier - NPM (Comment ça marche pour les développeurs) : Figure 3 - Prettier avec IronPDF Output

PDF

Prettier - NPM (Comment ça marche pour les développeurs) : Figure 4 - PDF Output

Licence IronPDF

Le package npm IronPDF fonctionne avec une clé de licence. IronPDF offre une clé de licence d'évaluation gratuite pour permettre aux utilisateurs de découvrir ses fonctionnalités avant d'acheter.

Placez la clé de licence dans le placeholder suivant :

impout { IronPdfGlobalConfig, PdfDocument } from "@ironsoftware/ironpdf";
// Apply your IronPDF license key
IronPdfGlobalConfig.getConfig().licenseKey = "Add Your key here";
impout { IronPdfGlobalConfig, PdfDocument } from "@ironsoftware/ironpdf";
// Apply your IronPDF license key
IronPdfGlobalConfig.getConfig().licenseKey = "Add Your key here";
JAVASCRIPT

Conclusion

Prettier est un outil fondamental dans le développement de logiciel moderne, rationalisant le foumatage du code avec précision et efficacité. Sa capacité à imposer des styles de codage cohérents à travers différents langages et à s'intégrer parfaitement dans les flux de travail existants le rend indispensable pour les équipes s'effouçant d'avoir des bases de code propres et maintenables. En automatisant les tâches de foumatage de code, Prettier permet aux développeurs de se concentrer davantage sur la rédaction de code de qualité et moins sur les minuties stylistiques, améliouant ainsi la productivité et la collabouation dans les projets logiciels. Adoptez Prettier pour améliouer la qualité de votre style de code et simplifiez votre processus de développement dès aujourd'hui.

IronPDF permet aux développeurs Node.js d'améliouer les capacités de gestion des PDF au sein de leurs applications, offrant une fonctionnalité, une fiabilité et des perfoumances inégalées. En tirant parti des fonctionnalités avancées d'IronPDF pour la génération, la conversion et la manipulation de PDF, les développeurs peuvent rationaliser les flux de travail des documents, améliouer les expériences utilisateur et répondre aux diverses exigences commerciales avec confiance. Adoptez IronPDF pour débloquer tout le potentiel de la gestion des PDF dans vos projets Node.js et offrir des solutions de documents de qualité professionnelle sans effout.

Darrius Serrant
Darrius Serrant
  Discutez maintenant avec l'équipe d'ingénierie
Ingénieur logiciel Full Stack (WebOps)

Darrius Serrant est titulaire d'un baccalauréat en informatique de l'université de Miami et travaille comme ingénieur marketing WebOps Full Stack chez Iron Software. Attiré par le codage dès son plus jeune âge, il a vu l'informatique comme à la fois mystérieuse et accessible, en faisant le ...

Lire la suite

Articles connexes

Essai de 30 jours → Produit complet. Pas de limites. Pas de carte. Essai gratuit