--- title: "Convert text to PDF in React | Nutrient" canonical_url: "https://www.nutrient.io/guides/web/conversion/text-to-pdf/react/" md_url: "https://www.nutrient.io/guides/web/conversion/text-to-pdf/react.md" last_updated: "2025-11-17T00:00:00.000Z" description: "Convert text to PDF in React directly in the browser with Nutrient Web SDK — no server setup, dependencies, or external services required." --- # Convert text to PDF in React Nutrient Web SDK is a client-side JavaScript library that’s fully compatible with React for converting text documents to PDF directly in the browser, without the need for server-side processing. To convert text files to PDF, Nutrient Web SDK relies entirely on its own technology built from the ground up, and it doesn’t depend on third-party tools. For more information on the supported formats, see the [list of supported file types](https://www.nutrient.io/guides/web/about/file-type-support.md). [Try for Free](https://www.nutrient.io/sdk/web/getting-started.md) ## Converting text documents to PDFs after displaying To convert a text document to a PDF after displaying it in the Nutrient viewer, follow the steps below. 1. [Load the source text document](https://www.nutrient.io/guides/web/open-a-document.md) (optional). To load the document without a user interface visible to the user, use the `headless` parameter. 2. Make changes to the document (optional). For example, [add annotations](https://www.nutrient.io/guides/web/annotations/create-edit-and-remove/create.md). 3. Convert the source document to a PDF with the [`exportPDF`](https://www.nutrient.io/api/web/NutrientViewer.Instance.html#exportPDF) method (optional). Use the `outputFormat` flag to create a PDF/A document. For more information, see [converting PDF to PDF/A](https://www.nutrient.io/guides/web/conversion/to-pdfa.md). 4. Save the output document. The `exportPDF` method returns a `Promise` that resolves to an `ArrayBuffer` containing the output PDF document. You can use the resulting `ArrayBuffer` to download or persist the output PDF in storage. For more information on downloading or persisting the exported `ArrayBuffer`, see the [guides on saving a document](https://www.nutrient.io/guides/web/save-a-document.md). The following example loads a text document and exports it to a PDF: ```js NutrientViewer.load({ container: "#pspdfkit", document: "source.txt", licenseKey: "YOUR_LICENSE_KEY" }).then((instance) => { instance.exportPDF(); }); ``` The following example loads a text document, exports it to a PDF with conformance level PDF/A-4f, and downloads it in the client’s browser: ```js NutrientViewer.load({ container: "#pspdfkit", document: "source.txt", licenseKey: "YOUR_LICENSE_KEY" }).then((instance) => instance.exportPDF({ outputFormat: { conformance: NutrientViewer.Conformance.PDFA_4F } }) ).then(function (buffer) { const blob = new Blob([buffer], { type: "application/pdf" }); const objectUrl = window.URL.createObjectURL(blob); downloadPdf(objectUrl); window.URL.revokeObjectURL(objectUrl); }); function downloadPdf(blob) { const a = document.createElement("a"); a.href = blob; a.style.display = "none"; a.download = "output.pdf"; a.setAttribute("download", "output.pdf"); document.body.appendChild(a); a.click(); document.body.removeChild(a); } ``` When you export a document, you can choose how Nutrient Web SDK writes the output. For more information, refer to the [flattening annotations](https://www.nutrient.io/guides/web/annotations/flatten.md) guide and the [incremental saving](https://www.nutrient.io/guides/web/features/document-processing.md) guide. Use autosave to configure when Nutrient Web SDK saves changes. For more information, refer to the [autosave](https://www.nutrient.io/guides/web/features/saving.md) guide. Call [`instance.save()`](https://www.nutrient.io/api/web/classes/NutrientViewer.Instance.html#save) before exporting if autosave is disabled, or after an undo, redo, or paste. Otherwise, the exported file doesn’t include unsaved annotations. ## Converting text documents to PDFs without displaying To convert a text document to a PDF without displaying it in the Nutrient viewer, follow the steps below. 1. Load and convert the source text document using the [`convertToPDF`](https://www.nutrient.io/api/web/NutrientViewer.html#.convertToPDF) method. This method takes the following parameters: - A [`Configuration` object](https://www.nutrient.io/api/web/NutrientViewer.Configuration.html) that specifies the path to the source document and the license key. - A member of the `Conformance` enumeration that specifies the conformance level of the output PDF document (optional). If you provide this parameter, the output is a PDF/A document. 2. Save the output document. The `convertToPDF` method returns a `Promise` that resolves to an `ArrayBuffer` containing the output PDF document. You can use the resulting `ArrayBuffer` to download or persist the output PDF in storage. For more information on downloading or persisting the exported `ArrayBuffer`, see the [guides on saving a document](https://www.nutrient.io/guides/web/save-a-document.md). The following example exports the loaded document to a PDF with conformance level PDF/A-4f: ```js NutrientViewer.convertToPDF( { document: "source.txt", licenseKey: "YOUR_LICENSE_KEY" }, NutrientViewer.Conformance.PDFA_4F ); ``` The following example converts a text document to a PDF document and downloads it in the client’s browser: ```js NutrientViewer.convertToPDF({ document: "source.txt", licenseKey: "YOUR_LICENSE_KEY" }).then(function (buffer) { const blob = new Blob([buffer], { type: "application/pdf" }); const objectUrl = window.URL.createObjectURL(blob); downloadPdf(objectUrl); window.URL.revokeObjectURL(objectUrl); }); function downloadPdf(blob) { const a = document.createElement("a"); a.href = blob; a.style.display = "none"; a.download = "output.pdf"; a.setAttribute("download", "output.pdf"); document.body.appendChild(a); a.click(); document.body.removeChild(a); } ``` When you export a document, you can choose how Nutrient Web SDK writes the output. For more information, refer to the [flattening annotations](https://www.nutrient.io/guides/web/annotations/flatten.md) guide and the [incremental saving](https://www.nutrient.io/guides/web/features/document-processing.md) guide. Use autosave to configure when Nutrient Web SDK saves changes. For more information, refer to the [autosave](https://www.nutrient.io/guides/web/features/saving.md) guide. Call [`instance.save()`](https://www.nutrient.io/api/web/classes/NutrientViewer.Instance.html#save) before exporting if autosave is disabled, or after an undo, redo, or paste. Otherwise, the exported file doesn’t include unsaved annotations. --- > Part of [Convert text to PDF using JavaScript](/guides/web/conversion/text-to-pdf.md) ## Related pages - [Convert text to PDF in Angular](/guides/web/conversion/text-to-pdf/angular.md) - [Convert text to PDF in ASP.NET](/guides/web/conversion/text-to-pdf/aspnet.md) - [Convert text to PDF in Blazor](/guides/web/conversion/text-to-pdf/blazor.md) - [Convert text to PDF in Electron](/guides/web/conversion/text-to-pdf/electron.md) - [Convert text to PDF in HTML5](/guides/web/conversion/text-to-pdf/html5.md) - [Convert text to PDF in jQuery](/guides/web/conversion/text-to-pdf/jquery.md) - [Convert text to PDF in Next.js](/guides/web/conversion/text-to-pdf/nextjs.md) - [Convert text to PDF in Nuxt.js](/guides/web/conversion/text-to-pdf/nuxtjs.md) - [Convert text to PDF in progressive web apps](/guides/web/conversion/text-to-pdf/pwa.md) - [Convert text to PDF in Svelte](/guides/web/conversion/text-to-pdf/svelte.md) - [Convert text to PDF in TypeScript](/guides/web/conversion/text-to-pdf/typescript.md) - [Convert text to PDF in Vue.js](/guides/web/conversion/text-to-pdf/vuejs.md)