GithubHelp home page GithubHelp logo

naosense / markdown-preview-sync Goto Github PK

View Code? Open in Web Editor NEW
59.0 3.0 9.0 1.13 MB

A quasi real-time vim markdown preview plugin | 第一款基于Java的Vim Markdown预览插件

Home Page: https://naosense.github.io/2018/08/04/%E8%B0%81%E8%AF%B4%E5%A4%A7%E8%B1%A1%E4%B8%8D%E8%83%BD%E8%B7%B3%E8%88%9E%EF%BC%9A%E5%9F%BA%E4%BA%8EJava%E7%9A%84Markdown%E9%A2%84%E8%A7%88%E6%8F%92%E4%BB%B6/

Python 1.86% Java 56.95% CSS 22.11% HTML 7.92% JavaScript 4.60% Vim Script 6.56%
markdown-preview vim-plugin markdown vim preview

markdown-preview-sync's Introduction

[TOC]

A quasi real-time vim markdown preview plugin

snapshot-en

snapshot-ch

Feature

  • Code Highlight
  • MathJax
  • Custom CSS
  • GFM-Table
  • TOC

Prerequisite

  • Jre8 or above
  • Vim with python2 or python3 support

Installation

If you use pathogen, do this: unzip release file markdown-preview-sync.zip to bundle directory.

If you don't use any plugin manager, just unzip release file markdown-preview-sync.zip, then copy files in /autoload and /plugin to Vim's /autoload and /plugin directory.

Setting

" Both Chrome and Firefox are good, but Chrome is prefer
" Set Chrome path
let g:markdown_preview_sync_chrome_path = ""

" Set Firefox path
let g:markdown_preview_sync_firefox_path = ""

" (Optional)Set your own css theme, put your css file in
" autoload/java/webapp/css directory with a name: name-theme.css,
" then set
let g:markdown_preview_sync_theme = "name"

" Set key
autocmd filetype markdown nnoremap <F9> :MarkSyncPreview<cr>
autocmd filetype markdown nnoremap <S-F9> :MarkSyncClose<cr>

Last but not least, comments and issues are welcome.


一款准实时的Vim Markdown预览插件

下面简单介绍下这款插件:

特性

  • 代码高亮
  • MathJax
  • 自定义CSS
  • GFM-Table
  • 目录TOC

安装准备

  • Jre8及以上
  • Vim支持python2或python3

安装方式

如果你使用pathogen,将release中的markdown-preview-sync.zip解压到bundle文件夹即可。

如果你没有使用任何插件管理工具,解压release中的markdown-preview-sync.zip,然后将/autoload和/plugin目录中的文件分别放在Vim的/autoload和/plugin目录即可。

设置

" Chrome和Firefox都可以,推荐使用Chrome
" 可以这样设置Chrome路径
let g:markdown_preview_sync_chrome_path = ""

" 设置Firefox浏览器路径
let g:markdown_preview_sync_firefox_path = ""

" (Optional)设置自定义CSS主题,将你的CSS文件放在autoload/java/webapp/css文件夹下,
" 以“主题名-theme.css”方式命名,然后设置如下变量
let g:markdown_preview_sync_theme = "主题名"

" 配置快捷键
autocmd filetype markdown nnoremap <F9> :MarkSyncPreview<cr>
autocmd filetype markdown nnoremap <S-F9> :MarkSyncClose<cr>

最后,欢迎大家多多提意见和建议。

后记:作为Vim粉丝一枚,一直在寻找一款好用的Markdown预览插件,功能要简单,能在书写之余偶尔撇一下效果即可,毕竟Markdown语法都烂熟于心了。先是偶然看到了Chrome一款插件Markdown Viewer,风格非常喜欢,遗憾的是不能与Vim同步,后来又发现一款Vim插件markdown-preview.vim,但是我装了好几次,在我的机器上老是报错。故事本来到此就结束了,但是程序猿乞肯如此轻易屈服,程序猿要让这天,再遮不住眼,要这地,再埋不了心,程序猿要用自己的双手开天辟地!经过程序猿在键盘上一顿猛干,markdown-preview-sync横空出世了!好了,就吹到这吧。

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.