Code Monkey home page Code Monkey logo

pmt's Introduction

PMT: Pug Media Tool

PMT is a robust solution for creating PDF media with Pug.

Version License

Motivation

This project is my attempt to replace LaTeX in my toolchain. I often use LaTeX to create pretty documents, presentations, etc. - any scenario in which structured documents are desired.

This project is still very much under construction. I don't intend to make any breaking changes, but this is your standard "stuff might break" warning.

Install

PMT is available via NPM. You can install it like any other NPM package:

$ npm i -g @jonpalmisc/pmt

Usage

The most simple usage secenario is as follows, where <file> is the the path to your input:

$ pmt <file>

This will process your input file (Pug) and produce a PDF adjacent to it using the internal (Chromium-based) PDF engine.

If you would like to use an alternate HTML-to-PDF engine such as Prince or WeasyPrint, you can instruct PMT to produce HTML output instead with the -x or --html flags:

$ pmt -x <file>

For advanced usage, use the -h or --help flags for more information.

Examples

One thing PMT is sorely lacking is example documents, etc. While they are not written in Pug and do not leverage PMT's syntax, the PrinceXML Samples and WeasyPrint Samples should serve to demonstrate the level of visual fidelity PMT is capable of, as they utilize similar technology.

I aim to create some examples and add them to the repo soon! Unfortunately, most of my existing work done in PMT is not publicly-sharable.

Default plugins

A handful of "plugins" are included by default. You can learn more about them in the following sections.

Markdown

You can write Markdown in your documents using the :markdown filter:

:markdown
  # An exciting heading

  With an even more exciting paragraph

SCSS

You can write SCSS in your documents or include SCSS files using the :scss filter:

style
  include:scss local.scss

  :scss
    html {
      font-family: sans-serif;
    }

You can also leverage the (somewhat limited) "standard library" of styles from either inline SCSS or from included files:

style
  :scss
    @import "std/base"

Extra plugins

The plugins in the sections below are also included with a standard install, but are not enabled by default. You can enable them via the -p flag. See the usage information for more details.

MathJax

You can write math equations to be automatically typeset by MathJax:

p Look, here's an inline square root: $\sqrt{x}$.

p Below, you can find a display equation:
p $$\int_a^b 6x \,dx = 3x^2 \Big|_a^b$$

Mermaid

Support for creating diagrams with Mermaid is included. You can define your diagrams in the body of a :mermaid filter:

:mermaid
  graph LR
    A[Start] --> B[End]

Hint: You must explicitly set your document's doctype (doctype html), otherwise Mermaid may not work as expected.

Smart quotes

The smart quotes plugin will automatically replace "dumb quotes" with typographically correct quote characters.

Syntax highlighting

There are two built-in plugins for syntax highlighting: one for Highlight.js and one for Prism.js, named highlight and prism, respectively. If you enable these plugins, you must use the default highlighting stylesheet (found in the include folder) or bring your own. Otherwise, it will appear as if nothing is happening! See the documentation for each highlighter for more info on customization.

Page polyfill

Chrome doesn't support some of the more fancy paged CSS features, but you can enable them through a polyfill with the pages plugin, which uses Paged.js under the hood.

License

Copyright © 2020 Jon Palmisciano. See LICENSE.txt for more information.

pmt's People

Contributors

jonpalmisc avatar

Stargazers

 avatar  avatar

Watchers

 avatar  avatar  avatar

pmt's Issues

LaTeX command drop-in replacements

While PMT is not meant to be a 1:1 LaTeX clone, it may be useful to add mixins for common LaTeX commands such as section headers, multi-column layouts, etc.

Add footnote mixin

Now that the Paged.js plugin has been released, footnote support should work under the Chrome renderer. Adding a mixin for it would make things a lot easier.

Add example documents

There are currently no examples included in the repo for how to use PMT. Examples should be added to demonstrate how to use PMT, as well as the extent of its capabilities.

Add plugin/mixin for procedural presentation slides

Creating slides with PMT would be awesome, but there is currently no way to segment slides like you can do in LaTeX with Beamer and \pause. A plugin or mixin to enable similar functionality would make PMT a good choice for presentations.

Migrate away from Yarn

Yarn is just an extra dependency at this point - NPM has gotten much better and can be used instead.

Add code highlighting plugin

It would be nice to have a plugin to automatically highlight code blocks. Highlight.js might be a good candidate, since it looks like the color scheme used can be customized from CSS, which makes customization easy.

Markdown renderer destroys double backslash

The Markdown renderer (markdown-it) is currently turning double backslashes into single backslashes, which breaks LaTeX in markdown for multiline environments. See attached picture below.

image

There aren't any obvious options to toggle in the markdown-it renderer. More investigation is needed, or a new Markdown renderer is needed.

Remove need to write temporary files

It should be possible to remove the need to write temporary files by just navigating to a HTML data string with Puppeteer, but this needs to be tested.

Add hyphenation plugin or improve defaults

One area where Chrome's renderer lacks compared to LaTeX is the hyphenation support. 3rd party hyphenation plugins or tweaks to the default hyphenation settings via an includable stylesheet should be investigated to try to achieve TeX-grade hyphenation.

Come up with a better name for the project

PMT isn't the most creative name - I came up with it during development because the output binary had to have a name. Having a name that works better in conversation and is less ambiguous would be nice.

Add support for a user include directory

Right now PMT ships with a standard library containing numerous mixins, stylesheets, etc. - however, some users may want to extend the standard library so they can re-use styles/mixins across documents easily. Support for a "user include directory" should be added to make this possible.

Extract hardcoded functions from strings into real functions

Some plugins have functions written inside strings to be placed inside elements, which is kinda sketchy. It would be better to make them part of the code, and get their string representations with Function.prototype.toString()

initScript.text = "mermaid.initialize({ flowchart: { htmlLabels: false } });";

`document.addEventListener("DOMContentLoaded",function(){renderMathInElement(document.body,{delimiters:[{left:"$$",right:"$$",display:!0},{left:"$",right:"$",display:!1}]})});`

Add Paged.js polyfill plugin

Chrome doesn't support CSS margin area selections (e.g. @bottom-left), which means they have been absent from PMT for a while. It looks like Paged.js has a polyfill to support this, which could be great as a plugin, and potentially integrated as default in the future.

Produce a compiler error when using mixins without necessary plugins

Currently, one can use the slides mixin defined in /std/slides.pug without using the slides plugin, which will produce unexpected output as the slides will not be split/processed. An additional, automatically enabled plugin should be added to try to catch cases like these by forcing the compile to fail if dependent plugins are not enabled.

Library/service support

It would be awesome if PMT could be integrated with other programs as a library, i.e. make the npm package a callable library rather than just the CLI. This could allow PMT to be more easily integrated into a webserver, etc.

Look into Tailwind CSS support

I imagine adding support for Tailwind would be pretty complicated, but it could be very powerful for rapid document development. Creating this issue to serve as a reminder to look into it at a future date.

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.