tani / vim-glance

Preview document wrtting in YOUR markdown and asciidoc, POD.
39 stars 7 forks source link
deno denops markdown neovim pod vim vim-denops

vim-glance

UPDATE: The glance-vim now supports Asciidoc and POD file types. You can preview these file types within the vim editor by typing :Glance in a buffer that houses these specific file types.

The plugin offers a customization mechanism for rendering documents using markdown-it plugins. If you desire to use emojis within your markdown, you can simply append markdown-it-emoji plugin URL to the g:glance#plugins as shown below:

let g:glance#markdown_plugins = ['https://esm.sh/markdown-it-emoji']

The above plugin is loaded dynamically within Deno, consequently rendering the buffer content with markdown-it. The rendered content is subsequently dispatched as an HTML document to your browser.

Glance Vim offers various handy features:

Begin crafting your documents with your own flavored markdown.

Installation

This plugin requires denops.vim and Deno. For example, to use this plugin with vim-jetpack. Optionally, to use POD renderer, you need to install podium as well.

Jetpack 'vim-denops/denops.vim'
Jetpack 'tani/glance-vim'
Jetpack 'tani/podium'           "For POD file, optional

Usage

Please hit the command :Glance in Vim and open http://localhost:8765 in the browser. Use :GlanceStop to stop glance.

let s:stylesheet =<< trim END
html, body, #viewer {
  border: none;
  font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif;
}
END
let g:glance#stylesheet = join(s:stylesheet, "\n")

Advanced Usage

Glance Vim has an interface to extend the MarkdownIt renderer in TypeScript.

Step1: Set path of configuration file g:glance#config such as ~/.config/glance/init.ts

let g:glance#config = expand('~/.config/glance/init.ts')

Step2: Write a configuration in TypeScript.

// ~/.config/glance/init.ts
import markdownItEmoji from "https://esm.sh/markdown-it-emoji";
import MarkdownIt from "https://esm.sh/markdown-it";

export function createMarkdownRenderer(md: MarkdownIt): MarkdownIt {
  return md.use(markdownItEmoji);
}

Related Plugins

Copyright and License

Copyrihgt (c) 2023 TANIGUCHI Masaya. All rights reserved. This plugin is released under MIT License