Giter Site home page Giter Site logo

ernest-rakhmatulin / nuxt-pdf Goto Github PK

View Code? Open in Web Editor NEW

This project forked from ch99q/nuxt-pdf

0.0 0.0 0.0 5.28 MB

๐Ÿ’ซ Awesome module to generate PDF files and manage PDF inyour Nuxt application.

License: MIT License

CSS 11.48% JavaScript 78.39% Vue 10.13%

nuxt-pdf's Introduction

Nuxt PDF [WIP]

Looking for new maintainer. Since i don't work in the nuxt universe as much anymore, please write to me if you wish to take over this project.

npm npm (scoped with tag) License

Generate PDF files directly from your content on your website, can be used for offline downloadable documentation pages.

Features

  • Create PDF from Vue template
  • Automatic PDF Generation
  • Customizable Metadata
  • Supports (A1, A2, A3, A4, A5, Letter, Legal, Tabloid)
  • Support dynamic routes (Nuxt Generate)
  • Support dynamic titles (from <title> tag)
  • I18n support for specific languages
  • Generates as you edit (Automatic PDF regeneration)
  • For NUXT 2.x and higher

Table of Contents

Installation

npm install nuxt-pdf --save-dev

or

yarn add -D nuxt-pdf

Usage

  • Add the class .page to your page to display when printing, for formatting, add classes: .a1, .a2, .a3, .a4, .a5, .letter, .legal, or .tabloid

  • Add nuxt-pdf to the buildModules section of your nuxt.config.js file:

buildModules: ['nuxt-pdf']
  • Add a custom configuration with the pdf property.

You can see the available options in the example configuration

// nuxt.config.js

{
  buildModules: [
    'nuxt-pdf'
  ],
  pdf: {
    // custom configuration
  }
}

Configuration

// nuxt.config.js

{
  pdf: {
    /*
    * Output folder for generated pdf.
    */
    dir: "static",

    /*
    * Function options for page.pdf([options])
    * Read more: https://pptr.dev/#?product=Puppeteer&version=v2.0.0&show=api-pagepdfoptions
    */
    pdf: {
      // Change the format of the pdfs.
      format: "A4", // This is optional 
      printBackground: true // Include background in pdf.
    }

    /*
    * Function options for page.setViewport([options])
    * Read more: https://pptr.dev/#?product=Puppeteer&version=v2.0.0&show=api-pagesetviewportviewport
    */
    viewport: {
      // override the default viewport
      width: 1280,
      height: 800
    },

    /*
    * Enable i18n support.
    */
    i18n: false,

    /*
     * Add options to the puppeteer launch.
     * Read more: https://pptr.dev/#?product=Puppeteer&version=v2.0.0&show=api-puppeteerlaunchoptions
     */
    puppeteer: {
      // Puppeteer options here... E.g. env: {}
    },

    /*
    * PDF Meta configuration. (inspired by vue-meta)
    */
    meta: {
      title: "My Module",
      titleTemplate: "Documentation โ”€ %s",

      author: "Christian Hansen",
      subject: "Example",

      producer: "Example Inc.",

      // Control the date the file is created.
      creationDate: new Date(),

      keywords: ["pdf", "nuxt"]
    },

    /*
    * PDF generation routes. (expanding nuxt.generate)
    */
    routes: [
      {
        // Output file inside output folder.
        file: "downloads/documentation.pdf",

        // Route to content that should be converted into pdf.
        route: "docs",

        // Default option is to remove the route after generation so it is not accessible
        keep: true, // defaults to false

        // Specifify language for pdf. (Only when i18n is enabled!)
        locale: 'da',

        // Override global meta with individual meta for each pdf.
        meta: {
          title: "Home"
        },
        pdf: {
          // route specific pdf options
          landscape: true // Include background in pdf.
        },
        viewport: {
          // route specific viewport
          width: 1280,
          height: 800
        },
      },
      {
        // Output: static/downloads/documentation-vue.pdf
        file: "downloads/documentation-vue.pdf",

        // Will generate route https://localhost:3000/docs/vue
        route: "docs/vue",

        // Title will be Documentation - Vue
        meta: {
          title: "Vue"
        }
      }
    ]
  }
}
  • PDF generation

PDFs will be generated when running nuxt build, nuxt generate or in development nuxt dev

Development

$ git clone https://github.com/ch99q/nuxt-pdf.git

$ cd nuxt-pdf

$ yarn

License

MIT License

nuxt-pdf's People

Contributors

ch99q avatar dependabot[bot] avatar jerodfritz avatar imrealashu avatar rvondohlen avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.