npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

mdmath

v2.7.4

Published

LaTeX Math for Markdown ... with macros and more

Downloads

68

Readme

mdmath Markdown+Math

marketplace marketplace License npm

What is it ...

mdmath allows to use Visual Studio Code as a markdown editor capable of typesetting and rendering TeX math.K, In fact it now reuses the built in markdown viewer. KaTeX works inside as a fast math renderer.

You can install the extension directly from Visual Studio Code Marketplace.

What is new in mdmath 2.7.0 ...

  • Different themes for HTML export are supported now. Users can choose

    • default
    • minimal
    • publication (LaTeX style)

    theme in user settings.

  • about LaTeX style publication theme:

  • Commutative diagrams are working now.

  • Insert Table Of Content command available. Inject ToC at cursor location via Insert Table of Content from Command Palette (Ctrl+K T).

  • User notification on HTML export can be suppressed via boolean user setting Silent (default: false).

  • Enforce inline math $...$ pair being enclosed by space characters as a guard against misinterpretation of single $'s in normal markdown via user setting Outerspace (default: false for backward compatibility).

Features

Simplify the process of authoring and live previewing markdown documents containing math formulas. This extension is a comfortable tool for scientists, engineers and students with markdown as their first choice document format.

  • Inline math
  • Display math (Pandoc compatible)
  • Formula numbering
  • Inline math with tables
  • Works offline.
  • Integrated in native markdown viewer. So after installing the extension, TeX math is properly displayed in the markdown preview window.
  • Based on markdown-it plugin markdown-it-texmath.
  • Using vscode's Markdown Extension API.
  • Editor view and Preview are synchronized while scrolling.
  • Copy resulting HTML code to the system clipboard.
  • Due to markdown-it-texmath's support of different formula delimiters, these are also available and user configurable with mdmath:
    • 'dollars' (default)
      • inline: $...$
      • display: $$...$$
      • display + equation number: $$...$$ (1)
    • 'brackets'
      • inline: \(...\)
      • display: \[...\]
      • display + equation number: \[...\] (1)
    • 'gitlab'
      • inline: $`...`$
      • display: ```math ... ```
      • display + equation number: ```math ... ``` (1)
    • 'julia'
      • inline: $...$ or ``...``
      • display: ```math ... ```
      • display + equation number: ```math ... ``` (1)
    • 'kramdown'
      • inline: $$...$$
      • display: $$...$$
      • display + equation number: $$...$$ (1)

mdmath editing

Installation ...

... from inside of VSCode

Press F1 key inside of Visual Studio Code and type extension. Choose Extensions: Install Extension and then select the Markdown+Math extension from the list.

... from Mac & Linux Command Line

cd $HOME/.vscode/extensions
git clone https://github.com/goessner/mdmath.git
cd mdmath
npm install

... from Windows Command Line

cd  %USERPROFILE%\.vscode\extensions
git clone https://github.com/goessner/mdmath.git
cd mdmath
npm install

Usage

  • Launch VS Code, create or open a markdown file (.md).
  • Open a preview window.
  • Typeset in your markdown source window and see the preview window live updating.
  • Press Ctrl+K , or run the command Save Markdown+Math to HTML to save the corresponding HTML source to the file system.
  • Press Ctrl+K . or run the command Clip Markdown+Math to HTML to copy the corresponding HTML source to the underlying systems clipboard.
  • Press Ctrl+K T or run the command Insert Table of Content to insert a generated Table of Content at cursor location.

User Settings

Default Settings

  "mdmath.delimiters": "dollars",
  "mdmath.macros": {},
  "mdmath.macroFile": "",
  "mdmath.savePath": "./${file.name}.html",
  "mdmath.autosave": false,
  "mdmath.style": "",
  "mdmath.theme": "default",
  "mdmath.silent": false,
  "mdmath.outerspace": false

Example Settings

mdmath example user settings

Dependencies

  • markdown-it: The markdown renderer also used in VS Code.
  • katex: This is where credits for fast rendering TeX math in HTML go to.

FAQ

  • How to define my own CSS file for HTML export ?

    • Define it by the user setting mdmath.style as an absolute URL. So for an example you might choose mdmath.style: "file://c:/mystyle/mystyle.css" with windows.
  • How to define and use macros ?

    • Define them in user settings. For example ...
    "mdmath.macros": {
        "\\RR": "\\mathbb{R}",
        "\\vek": "{\\begin{pmatrix}#1\\\\#2\\end{pmatrix}}"
    }
    • Use them in your markdown document. For example ...
    Vectors in $\RR^2$ have a shape of
    
    $$\vek{x}{y}$$
  • How to define macros in a user macro file?

    • Create a JSON file containing the macros and define its path in user settings. For example ...
    "mdmath.macroFile": "c:/myfiles/mymacros.json"
    • Define the macros the same way as in the user settings.
    • User macro definition file has priority over user defined macro settings, which are ignored then.
  • Are there global predefined macros ?

    • No. Macros are user defined with user settings mdmath.macros. So they are available in all user specific markdown documents.
  • Can I write the HTML source to a file ?

    • Yes. Use the Markdown: Save Markdown+Math to Html command or the key binding Ctrl+K,.
    • The Html file is written to the folder where the markdown file resides in. This is the default.
    • You can change the destination folder by specifying a relative path to your working directory with the help of the user setting mdmath.savePath. So for an example you might choose mdmath.savePath: "./html/${file.name}.html".
  • Can I synchronously let the HTML source file update ?

    • Yes. Simply set the user setting mdmath.autosave: true for this (default is false).
    • Now, whenever you save your markdown file, the corresponding Html file is also saved.
    • The destination folder mdmath.savePath is used for this.
  • Formula highlighting is broken ?

    • It is implemented only for $ delimiters at present.
    • $ characters in markdown text are sometimes confused with math delimiters. Enclose them by backticks (`) then.
    • Formula highlighting is possible only for formulas on a single line. It breaks with every newline character.
    • Math highlighting is completely different from LaTeX math parsing.
  • Which functions does KaTeX support ?

  • What if I need to use the currency symbol $ also in my markup ?

    • It should be safe to use it. If in doubt escape it.
  • What are the restrictions with inline formulas ?

    • Whitespace after opening $ and before closing $ is not allowed.
    • Numeric character before opening $ and after closing $ is not allowed.
    • At least one character (whitespace ?) is required between two consecutive inline formulas.
    • Line break inside is not allowed.
  • What are the restrictions with display formulas ?

    • Not allowed inline of text.
    • Not allowed inside of tables. Use inline math there instead.
    • Blank lines before and behind required.
    • Restrictions for inline formulas do not apply.
  • Can I use math markup in blockquotes ?

    • We can use inline and display formulas in blockquote sections.
    • Multiline display math expressions require leading > characters on each line.
    • Multilevel blockquote sections work as expected.
  • Can I use math markup in code blocks ?

    • No, math markup in code blocks is shown - as expected - as markup. This is consistent now, but in contrast to mdmath versions prior to 2.0.
  • Can I access the HTML source of the markdown file ?

    • Yes. Use the Markdown: Clip Markdown+Math to Html command or the key binding Ctrl+K..
    • The markdown preview window has to be opened once for this in order to function properly.
    • You need to have the markdown source window activated here (not the preview window!).
    • Please note, that the resulting HTML source references 'CDN'-located remote css files. Change those references to local URL's if necessary.
  • Is PDF output supported ?

    • Not directly. In order to create *.pdf output from your Markdown you can create a *.html document first and print it then using a PDF printer or use Pandoc.
    • See Compiling Markdown into HTML.
  • Can I use custom CSS styles for the preview window ?

    • Yes. Set mdmath.style in user settings to the location of your custom CSS file. Its path must be relative to this extension root.
  • Can we store Latex macros with mdmath ?

    • Yes, there is a new section mdmath.globalMacros in package.json. Try to expand it with your own macros.

Thank You

The following folks helped to make mdmath even better.

  • elviswolcott: Implemented the feature of directly saving HTML to the file system including autosave ability.
  • colinfang: helped with implementing macros for mdmath 2.3.5.
  • lincr: Helped with fixing problems with mdmath.clipToHtml under Ubuntu.
  • TonySFU: Helped with fixing encoding problems with Chinese language under macOS when using mdmath.clipToHtml.
  • floatdrop: Verifying that clipboardy is a better alternative to copy-paste by implementing.
  • zhanglix: Helped with fixing the newline bug with gitlab delimiters.

Contributing

See .github/CONTRIBUTING.md

Changelog

See changelog.md

License

Markdown+Math for VS Code is licensed under the MIT License

© Stefan Gössner