Git Product home page Git Product logo

supermarked's Introduction

supermarked

Marked with useful extensions:

  • Syntax highlighting (via CodeMirror)
  • LaTeX for maths (via KaTeX)
  • Mentions (just like in a GitHub issue)

Build Status Dependency Status NPM version

API

var marked = require('supermarked');
marked('markdown string', options);

Extensions currently supported

Syntax highlighting

Syntax highlighting using CodeMirror is enabled by default for code samples (requires css to actually have an impact). You can control the CodeMirror theme using the theme option, and should include the appropriate CSS for your chosen theme. e.g.

<link rel="stylesheet" href="https://codemirror.net/lib/codemirror.css">

example

To disable syntax highlighting pass {highlight: false} for the options, or to use custom highlighting pass a function for the highlight option.

KaTeX

You can write maths using LaTeX syntax, which will be compiled to HTML using KaTeX. You must start maths expressions with a backtick followed by a dollar sign, and end it with a dollar sign followed by a backtick. You can use two dollar signs for "Display Style" math (i.e. display: block). For this to work, you must also add the KaTeX stylesheet to your page, and ensure that it is in UTF8

<meta charset="utf8">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.1.1/katex.min.css">

example

To disable KaTeX pass {math: false} for the options.

Mentions

You can use service: @user anywhere to mention someone and it will turn into a social link. Supported services are twitter, github, npm, and facebook. All of them are case sensetive and the space between : and @ is optional.

In addition you can specify an '@' service that will then be used for mentions where no service was specified. You can supply a custom service like:

var html = marked(src, {
  services: {
    // by default, see if they are mentioning me and if they are, link to my blog
    '@': function (user) {
      return user === 'ForbesLindesay' ? 'http://www.forbeslindesay.co.uk' : null;
    },
    // provide an "example" service
    'example': 'http://www.example.com/user/:user:',
    // don't let people use the facebook service
    'facebook': false
  }
});

example

To disable mentions pass {mentions: false} for the options.

License

MIT

supermarked's People

Contributors

forbeslindesay avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar

supermarked's Issues

CodeMirror Themes

Any ideas for passing non-default? Currently I'm changing all the classes at page load.

Catch KaTeX errors

Hi, would you be open to the following amendment?

try {
    var html = katex.renderToString(expr);
} catch(err) {
    var html = "<div><code>" + err + "</code></div>";
}

I'm using supermarked with instant-markdown-d and vim-instant-markdown and it sucks when Node crashes whenever KaTeX stumbles over a syntax error in the math string. I can create a PR if you like.

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.