彩世界平台-彩世界时时app-彩世界开奖app苹果下载

热门关键词: 彩世界平台,彩世界时时app,彩世界开奖app苹果下载

您的位置:彩世界平台 > 新闻动态 > 前端开发工具(插件)

前端开发工具(插件)

发布时间:2019-11-03 22:56编辑:新闻动态浏览(155)

    Vim常用插件——前端开发工具系列

    2015/08/16 · HTML5 · vim, 插件

    原文出处: AlloyTeam   

    作为一名开发者,应该对编辑器之神Vim)与神之编辑器Emacs有所耳闻吧。编辑器之战的具体细节有兴趣的童鞋可以google之。

    Vim最大的特点是打开速度快,功能强大,一旦掌握了其中的命令,编程过程双手就不需要离开键盘了。

    用习惯了Vim的另一个好处是在linux下可以很轻松地用vi来处理文件,当然emacs也可以做默认编辑器,但是不是每台机器都有安装Emacs。

    今天主要给大家介绍Vim在前端领域的一些常用插件:

    Bootstrap

      在众多插件中,Bootstrap是用得最多、功能最强大的。Bootstrap是目前很受欢迎的前端框架。Bootstrap 是基于 HTML、CSS、JavaScript 的,它简洁灵活,使得 Web 开发更加快捷。Bootstrap是基于HTML5和CSS3开发的,它在jQuery的基础上进行了更为个性化的完善,形成一套自己独有的网站风格,并兼容大部分jQuery插件。

      使用时需要在HTML代码的<head></head>标签中导入     文件路径/bootstrap-3.3.7-dist/css/bootstrap.min.css

    <head>
        <meta charset="UTF-8">
        <title>title</title>
        <link rel="stylesheet" href="bootstrap-3.3.7-dist/css/bootstrap.css">
    </head>
    

      

      使用方法详见官网链接:    中文全汉化网站:

     

    1.mark.vim

    mark.vim主要的功能是变量的高亮。

    选中要高亮的词,使用 m 来使其高亮,多个词的高亮会显示为不同的颜色,在不需要查找的时候以及代码review的时候使用效果还是挺不错的,

    使用n可以去除所选的词的高亮。

    更多详情可以点击插件主页了解。

    ps: 查找单词可以使用 * 这个命令来进行快速搜索

    FontAwesome

      FontAwesome是一个拥有海量图标的网站,虽然Bootstrap中已经有非常多的图标供我们使用,但仍有捉襟见肘的时刻,FontAwesome可以很好的帮助我们解决图标不够用的问题。同理使用前需下载好文件并进行导入

      FontAwesome中文网:

     

    2.zencoding.vim

    zencoding.vim 后来改名为Emmet.vim,主要功能是实现代码的快速编写。

    具体教程可以参见官方的网站

    个人感受是做页面重构的时候用得比较多,通过命令可以快速生成html的结构,提高了前端开发的生产力。

    SweetAlert系列

      SweetAlert是一项对原生JS中的alert加以美化的工具,有SweetAlert2和SweetAlert22两个版本。

      现在多用SweetAlert2,下载及教程地址:

    *  SweetAlert 到 SweetAlert2 升级指南*

      使用前记得引入<script src="sweetalert2/sweetalert2.js"></script>

     

     

    3.ctrlp.vim

    ctrlp.vim主要功能是对文件以及buffer进行模糊查询,快速打开文件。

    操作实例如下图所示:

    图片 1

    图片 2

    在知道文件名的情况下,使用ctrl + p打开此插件,输入文件名,实则是文件名开头几个字母就可以快速打开文件。

    ps:如果当前的文件已经保存好,那么会直接替换成搜索到的文件,如果没有保存的,会进行窗口的分隔类似与sp的命令。

    所以在对比文件的情况下我一般会用vsp来分割窗口或者tabnew一个新的tab,再打开新的文件。

    如果需要查其他目录或者忘记了文件名的话,就可以使用下面的插件NERD_tree了。

    Toastr通知

     

    *        Toastr*

     

    本文由彩世界平台发布于新闻动态,转载请注明出处:前端开发工具(插件)

    关键词:

上一篇:WEB前端的发展历程

下一篇:没有了