1. IronPDF for Node.js
  2. IronPDF for Node.js博客
  3. 节点帮助
  4. 更漂亮的 NPM
节点帮助

Prettier - NPM（如何为开发人员工作）

发布 2024年十月24日
分享:

在现代软件开发中，保持编码风格的简洁和一致对于可读性、协作性和可维护性都至关重要。 这些工具包括更漂亮在这一过程中，带有表示内置类型声明的 TypeScript 图标的 "TypeScript "已经成为不可或缺的辅助工具，它可以自动完成通常比较繁琐的代码格式化工作。 在本文中，我们将深入探讨 Prettier 的复杂性，探索其功能、优势、集成和最佳实践。 此外，我们还将研究IronPDFPDF 生成库，用于从网站 URL 生成 PDF。

Prettier 简介

Prettier 是一种有主见的代码格式化工具，可根据预定义的规则（如最大行长）自动调整代码的样式和格式。 它支持各种编程语言，包括 JavaScript、TypeScript、HTML、CSS、JSON 等，使其成为不同技术栈和项目类型的通用工具。Prettier 最初由 James Long 开发，因其强大的功能和易用性在开发者社区获得了极大的关注。

主要特点和优势

  1. 一致的代码风格：Prettier 可在您的整个代码库中执行一致的编码风格，消除对格式偏好的争论，确保代码外观的统一性，这有助于加快代码审查过程。

  2. 自动格式化：通过与代码编辑器或构建流程集成，Prettier 可在您输入代码时或提交前自动格式化您的代码，包括封装代码等，从而为开发人员节省宝贵的时间和精力。 您可以将该意见代码格式化工具配置为在保存代码时运行。 仅适用于与源代码相同的目录。

  3. 可配置性：虽然 Prettier 默认为意见式，但它提供了一定程度的可配置性，可调整某些格式规则以适应项目的特定要求。 用户可以配置自己的规则。

  4. 语言支持：开箱即支持多种编程语言和格式，确保与各种开发环境兼容。 代码质量：提高代码的可读性有助于更好地理解代码，并降低因格式不一致而导致语法错误或错误的可能性。

Prettier 入门

安装

要开始在项目中使用 Prettier，可以通过 NPM 或 yarn 进行安装：

npm install prettier --save-dev
npm install prettier --save-dev
'INSTANT VB TODO TASK: The following line uses invalid syntax:
'npm install prettier --save-dev
VB   C#

或

yarn add --dev prettier // installs latest version
yarn add --dev prettier // installs latest version
'INSTANT VB TODO TASK: The following line uses invalid syntax:
'yarn add --dev prettier ' installs latest version
VB   C#

使用方法

  • 命令行界面(CLI)**:Prettier 提供了一个 CLI 工具，用于手动格式化文件，或将其集成到脚本中以执行自动格式化任务。
  • 编辑器集成：为 Visual Studio Code、Sublime Text、Atom 等常用编辑器提供插件，可在输入时实时格式化。
  • Git 钩子：使用 Git Hooks 设置 Prettier，使其在提交前运行，以确保所有代码更改都符合定义的格式规则。

集成和生态系统

Prettier 可与各种开发工具和工作流程无缝集成，从而增强了其实用性并得到开发人员的广泛采用：

  • IDE 插件：与集成开发环境和文本编辑器集成，可即时格式化代码，提高开发人员的工作效率并保持编码标准。
  • 构建系统：融入构建管道和持续集成(CI)工作流程，以便在团队项目中执行一致的代码格式。
  • 版本控制：与 Git 等版本控制系统协调工作，确保在整个协作过程中始终保持格式化的代码。

Prettier 的最佳实践

为了最大限度地发挥 Prettier 的优势，并确保顺利集成到您的开发工作流程中，请考虑以下最佳实践：

  • 使用默认设置：最初使用 Prettier 的默认设置，以促进整个代码库的一致性，而无需进行不必要的定制。
  • 版本：定期更新 Prettier，以利用新功能、错误修复和改进的语言支持。
  • 配置：对 Prettier 的配置进行微调，以符合项目的特定习惯或团队偏好，同时保持一致性。
  • 教育和采用：鼓励团队成员采用 Prettier，并向他们介绍 Prettier 的优势，以促进统一的代码格式化方法。

IronPDF 简介

Prettier - NPM（如何为开发人员工作）：图 1 - IronPdf

IronPDF是一个流行的 PDF 生成库，用于生成、编辑和转换 PDF 文档。 IronPDF NPM 软件包专为 Node.js 应用程序设计。 以下是 IronPDF NPM 软件包的一些主要功能和详细信息：

主要功能

HTML 转换为 PDF

将 HTML 内容轻松转换为 PDF 文档。 此功能特别适用于从网页内容生成动态PDF。

URL 转换为 PDF

直接从 URL 生成 PDF，允许您捕获网页内容并以编程方式将其保存为 PDF 文件。

PDF 操作

轻松合并、拆分和操作现有的PDF文档。 IronPdf 提供附加页面、分割文档等功能。

PDF 安全

通过设置密码或应用数字签名来保护您的PDF文档。 IronPDF 提供选项以保护您的敏感文档免受未经授权的访问。

高质量输出

生成高质量的PDF文档，精确渲染文本、图像和格式。 IronPDF 确保您生成的 PDF 保持与原始内容的一致性。

跨平台兼容性

IronPDF兼容多个平台，包括Windows、Linux和macOS，使其适用于广泛的开发环境。

简单集成

使用其npm软件包轻松将IronPDF集成到您的Node.js应用程序中。 API 文档详实，使将 PDF 生成功能集成到您的项目中变得简单明了。

安装

要安装 IronPDF NPM 软件包，请使用以下命令：

yarn add @ironsoftware/ironpdf @ironsoftware/ironpdf-engine-windows-x64
yarn add @ironsoftware/ironpdf @ironsoftware/ironpdf-engine-windows-x64
IRON VB CONVERTER ERROR developers@ironsoftware.com
VB   C#

使用 IronPDF 生成 PDF 文档并使用 Prettier NPM 软件包

安装依赖项：首先，创建一个新的 Next.js 项目(如果你还没有)使用以下命令：参阅这里.

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"
'INSTANT VB TODO TASK: The following line uses invalid syntax:
'npx create-@next-app@latest prettier-pdf --use-npm --example "https://github.com/vercel/next-learn/tree/main/basics/learn-starter"
VB   C#

接下来，导航到你的项目目录：

cd prettier-pdf
cd prettier-pdf
'INSTANT VB TODO TASK: The following line uses invalid syntax:
'cd prettier-pdf
VB   C#

安装所需的软件包：

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
'INSTANT VB TODO TASK: The following line uses invalid syntax:
'yarn add @ironsoftware/ironpdf @ironsoftware/ironpdf-engine-windows-x64 yarn add -D prettier
VB   C#

创建一个空的配置文件，让编辑器和其他工具知道您正在使用 Prettier：

node --eval "fs.writeFileSync('.prettierrc','{}\n')"
node --eval "fs.writeFileSync('.prettierrc','{}\n')"
'INSTANT VB TODO TASK: The following line uses invalid syntax:
'node --eval "fs.writeFileSync('.prettierrc','{}" + vbLf + "')"
VB   C#

创建一个.prettierignore该文件用于让 Prettier CLI 和编辑器知道哪些文件应_not_格式化。 下面是一个样本：

# Ignore artifacts:
build
coverage
# Ignore all HTML files:
**/*.html
# Ignore artifacts:
build
coverage
# Ignore all HTML files:
**/*.html
#Ignore artifacts:
#Ignore all HTML files:
'INSTANT VB TODO TASK: The following line uses invalid syntax:
'build coverage **/ *.html
VB   C#

创建 PDF

现在，让我们创建一个使用 IronPDF 生成 PDF 的简单示例。

PDF 生成 API：第一步是创建生成 PDF 文档的后台 API。 由于IronPDF只在服务器端运行，我们需要创建一个API，以便在用户想生成PDF时调用。 在 pages/api/pdf.js 路径下创建一个文件，并添加以下内容。

IronPDF需要许可证密钥，您可以从许可证页面Please provide the content you would like translated into Chinese along with the code where it should be placed.

// pages/api/pdf.js
import {IronPdfGlobalConfig, PdfDocument} from "@ironsoftware/ironpdf";
// Apply your IronPDF license key
IronPdfGlobalConfig.getConfig().licenseKey = "Your license key";
export default async function handler(req, res) {
    try {
        const url = req.query.url
        const pdf = await PdfDocument.fromUrl(url);
        const data = await pdf.saveAsBuffer();
        console.error('data PDF:', data);
        res.setHeader('Content-Type', 'application/pdf');
        res.setHeader('Content-Disposition', 'attachment; filename=awesomeIron.pdf');
        res.send(data);
    } catch (error) {
        console.error('Error generating PDF:', error);
        res.status(500).end();
    }
}
// pages/api/pdf.js
import {IronPdfGlobalConfig, PdfDocument} from "@ironsoftware/ironpdf";
// Apply your IronPDF license key
IronPdfGlobalConfig.getConfig().licenseKey = "Your license key";
export default async function handler(req, res) {
    try {
        const url = req.query.url
        const pdf = await PdfDocument.fromUrl(url);
        const data = await pdf.saveAsBuffer();
        console.error('data PDF:', data);
        res.setHeader('Content-Type', 'application/pdf');
        res.setHeader('Content-Disposition', 'attachment; filename=awesomeIron.pdf');
        res.send(data);
    } catch (error) {
        console.error('Error generating PDF:', error);
        res.status(500).end();
    }
}
IRON VB CONVERTER ERROR developers@ironsoftware.com
VB   C#

现在修改 index.js 代码如下，以便使用 Prettier 和 IronPDF。

import Head from 'next/head';
import styles from '../styles/Home.module.css';
import React, { useState } from 'react';
export default function PrettierDemo() {
    const [text, setText] = useState("");
    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 (error) {
            console.error('Error generating PDF:', error);
        }
    };
    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>{" "}
                </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;
                }
                footer {
                    width: 100%;
                    height: 100px;
                    border-top: 1px solid #eaeaea;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                }
                footer img {
                    margin-left: 0.5rem;
                }
                footer a {
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    text-decoration: none;
                    color: inherit;
                }
                code {
                    background: #fafafa;
                    border-radius: 5px;
                    padding: 0.75rem;
                    font-size: 1.1rem;
                    font-family: Menlo,
                    Monaco,
                    Lucida Console,
                    Liberation Mono,
                    DejaVu Sans Mono,
                    Bitstream Vera Sans Mono,
                    Courier New,
                    monospace;
                }
            `}</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: border-box;
                }
            `}</style>
        </div>
    );
}
import Head from 'next/head';
import styles from '../styles/Home.module.css';
import React, { useState } from 'react';
export default function PrettierDemo() {
    const [text, setText] = useState("");
    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 (error) {
            console.error('Error generating PDF:', error);
        }
    };
    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>{" "}
                </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;
                }
                footer {
                    width: 100%;
                    height: 100px;
                    border-top: 1px solid #eaeaea;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                }
                footer img {
                    margin-left: 0.5rem;
                }
                footer a {
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    text-decoration: none;
                    color: inherit;
                }
                code {
                    background: #fafafa;
                    border-radius: 5px;
                    padding: 0.75rem;
                    font-size: 1.1rem;
                    font-family: Menlo,
                    Monaco,
                    Lucida Console,
                    Liberation Mono,
                    DejaVu Sans Mono,
                    Bitstream Vera Sans Mono,
                    Courier New,
                    monospace;
                }
            `}</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: border-box;
                }
            `}</style>
        </div>
    );
}
'INSTANT VB TODO TASK: The following line uses invalid syntax:
'import Head from '@next/head'; import styles from '../styles/Home.@module.css'; import React, { useState } from 'react'; export default @function PrettierDemo() { const [text, setText] = useState(""); const generatePdf = async() => { try { const response = await fetch('/api/System.Nullable<pdf>url='+text); const blob = await response.blob(); const url = window.URL.createObjectURL(New Blob([blob])); const link = document.createElement("a"c); link.href = url; link.setAttribute('download', 'awesomeIron.pdf'); document.body.appendChild(link); link.click(); link.parentNode.removeChild(link); } catch(@error) { console.@error('@Error generating PDF:', @error); } }; 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>{" "} </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; } footer { width: 100%; height: 100px; border-top: 1px solid #eaeaea; display: flex; justify-content: center; align-items: center; } footer img { margin-left: 0.5rem; } footer a { display: flex; justify-content: center; align-items: center; text-decoration: none; color: inherit; } code { background: #fafafa; border-radius: 5px; padding: 0.75rem; font-size: 1.1rem; font-family: Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier @New, monospace; } `}</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: border-box; } `}</style> </div>); }
VB   C#

使用 yarn prettier 格式化代码。

yarn prettier . --write
yarn prettier . --write
'INSTANT VB TODO TASK: The following line uses invalid syntax:
'yarn prettier. --write
VB   C#

Prettier - NPM（如何为开发人员工作）：图 2 - 运行 Prettier

现在使用以下命令运行应用程序：

yarn dev
yarn dev
'INSTANT VB TODO TASK: The following line uses invalid syntax:
'yarn dev
VB   C#

输出

Prettier - NPM（如何为开发人员工作）：图 3 - Prettier 与 IronPDF 输出

PDF

Prettier - NPM（如何为开发人员工作）：图 4 - PDF 输出

IronPDF 许可证

IronPdf npm 包在许可证密钥上运行。 IronPDF 提供一个免费试用许可证密钥让用户可以在购买之前检验其广泛功能。

在此处放置许可证密钥：

import {IronPdfGlobalConfig, PdfDocument} from "@ironsoftware/ironpdf";
// Apply your IronPDF license key
IronPdfGlobalConfig.getConfig().licenseKey = "Add Your key here";
import {IronPdfGlobalConfig, PdfDocument} from "@ironsoftware/ironpdf";
// Apply your IronPDF license key
IronPdfGlobalConfig.getConfig().licenseKey = "Add Your key here";
IRON VB CONVERTER ERROR developers@ironsoftware.com
VB   C#

结论

Prettier 是现代软件开发的基石工具，可精确高效地简化代码格式。 它能够在不同语言中执行一致的编码风格，并无缝集成到现有的工作流程中，这使它成为努力实现简洁、可维护代码库的团队不可或缺的工具。 通过自动完成代码格式化任务，Prettier 使开发人员能够将更多精力放在编写高质量的代码上，而不是文体上的细枝末节或代码审查上，从而最终提高软件项目的生产率和协作性。 立即使用 Prettier，提升代码风格质量，简化开发流程。

IronPDF 使 Node.js 开发人员能够在其应用程序中提升 PDF 处理能力，提供无与伦比的功能、可靠性和性能。 通过利用 IronPDF 在 PDF 生成、转换和操作方面的高级功能，开发人员可以简化文档工作流程，增强用户体验，并满怀信心地满足各种业务需求。 使用 IronPDF，在您的 Node.js 项目中释放 PDF 处理的全部潜能，毫不费力地交付专业级文档解决方案。

< 前一页
oauth2orize NPM（如何为开发人员工作）
下一步 >
rxjs NPM（如何为开发人员工作）

使用 npm 安装

版本：2024.11

> npm i @ironsoftware/ironpdf

报告问题

准备开始了吗？ 版本： 2024.11 刚刚发布

免费 npm 安装 查看许可证 >