zoukankan      html  css  js  c++  java
  • 用vim打造强大的markdown编辑器(CoffeeScript也是类似的)(含视频)

    介绍

    网上有很多在线markdown编辑器, 当你在文本框内输入markdown后, 在右侧就同步显示相对应的HTML.
    根据该原理, 可以制作一个vim版的markdown编辑器. 由于vim不是web浏览器, 就在右侧显示HTML代码吧!

    另外, 如果你使用vim写CoffeeScript的话, 本文也许对你有用.

    工具

    • vim - 高级文本编辑器
    • firefox - 网页浏览器
    • markdown - markdown解析器
    • pandoc - 增强版markdown解析器
    • tidy - HTML格式化工具

    配置

    " vimrc4md
    " Kev++@2012-06-27
    
    " 基本配置
    set nocompatible
    set autoread
    set autoindent
    set expandtab tabstop=4 softtabstop=4 shiftwidth=4
    set laststatus=2
    set mouse=a
    set t_Co=256
    
    " 转换Markdown为HTML
    let mapleader = ','
    nnoremap <leader>f  :silent! !firefox %<CR>
    nnoremap <C-m>      !!markdown<CR>
    vnoremap <C-m>      !markdown<CR>
    nnoremap <C-p>      !!pandoc<CR>
    vnoremap <C-p>      !pandoc<CR>
    
    " 启用语法侦测
    syntax on
    
    " 自动化命令
    au FileType markdown        let &l:mp='pandoc % \| tidy -q -i -utf8 --doctype omit --tidy-mark 0 --show-errors 0 -o %:r.html'
    au FileType markdown        nnoremap <buffer> <F5> :write \| silent make \| redraw!<CR>
    au BufWrite *.markdown      exe "normal \<F5>"
    
    " 提取文章标题
    com! -bar TOC call TOC()
    fun! TOC()
        call setloclist(0, [])
        let save_cursor = getpos(".")
        call cursor(1, 1)
        let flag = 'cW'
        while search("^#", flag) > 0
            let flag = 'W'
            let msg = printf('%s:%d:%s', expand('%'), line('.'), substitute(getline('.'), '#', '»', 'g'))
            laddexpr msg
        endwhile
        call setpos('.', save_cursor)
        silent! call ToggleLocationList()
    endfun
    
    " 配置插件
    let g:alternateExtensions_html = 'markdown'
    let g:alternateExtensions_markdown = 'html'
    set rtp+=~/.vim/bundle/powerline/
    set rtp+=~/.vim/bundle/alternate/
    let g:Powerline_symbols = 'fancy'
    

    说明

    视频演示

     
     
    标签: screencast
     
     
  • 相关阅读:
    zabbix 微信告警
    mongodb 的数据备份与还原
    Templates
    Rsyslog 基本结构
    matplotlib绘图学习
    pyhon 简介
    Pygame (Python编程从入门到实践)
    AttributeError: 'pygame.Surface' object has no attribute 'rect'
    PYTHON CLIENT API
    SALT.STATES.CMD模块
  • 原文地址:https://www.cnblogs.com/Leo_wl/p/2566343.html
Copyright © 2011-2022 走看看