选择编辑器的时候，很多人会对vim嗤之以鼻，但实际上，从一个角度来看，可以找到另一种风采。 本文的目的不是强烈推荐使用vim，而是在作者将vim作为Web开发项目的主编辑器的情况下发现一些差异。
作者| Fidel Sanchez-Bueno
译者|弯月面、责任篇| gddsp/p制造|csdn(id:csdnnews ) ) ) ) ) ) ) ) ) ) ) ) ) ) ) ) ) ) ) ) )。
以下是译文：
在学习编程的过程中，选择最适合自己的编辑器或IDE (以下编辑器指的是两者)是所有程序员都会经历的过程。 我的话，从9年前左右开始学习Python。 我记得当时每周都换编辑器。 一开始是IDLE，后来还记得尝试过Boa Constructor、Komodo、Notepad等。
在寻找最佳编辑器的过程中，可以了解程序员之间的编辑器之战，可以被Vim和Emacs的笑话逗乐。
也就是说这个时候，你打算学习Vim和Emacs。 从那里开始热看台的探险之旅。
从这篇文章的标题可以看出，我选择的编辑器是Vim，但是我不打算推荐你Vim。 另外，我也不打算花无数的时间说服别人改变自己的开发环境使用Vim。
本文的目的是在使用Vim作为Web开发项目的主编辑器时共享提高效率的定制。
Web开发的Vim插件
作为Web程序员，大部分时间都在编写HTML、CSS和JavaScript文件。 根据您的喜好和项目需求，还可以使用Angular、Vue、React等框架，以及babel、webpack、grunt等各种工具。
我个人会尽量减少插件的使用。 仅在插件带来了非常大的好处，并且可以真正改善工作流程时使用。
目前安装的外挂程式如下：
Emmet.vim
索引线和vim-jsx-pretty
虚拟机注释
ale (密封和保护) ) )。
Emmet.vim
Emmet是一个快速输入和编辑代码的好工具，只需输入一行代码就可以创建整个复杂的HTML。
索引线和vim-jsx-pretty
这两个插件改善了Vim的显示样式。 索引行可以通过添加垂直线来显示缩进级别。 vim-JSX-pretty可以向jsx代码添加具有吸引力的荔枝，适用于编写ReactJS等代码。
虚拟机注释
该插件只需选择代码并输入g-c，即可轻松对代码进行注释和取消注释。
ale (密封和保护) ) )。
异步链接(ale )可以调用linter和代码修饰工具，从而大幅提高工作效率。 不知道也没关系，用了绝对不会后悔的插件。 我使用ALE主要是为了调用prettier。
实时预览(热负荷) ) ) ) ) ) )。
通过实时检查更改的效果，工作流得到了很大的改善。 虽然许多项目(如React和Gatsby )已经包含此功能，但如果只是创建简单的网页(HTML、CSS、JavaScript )，则可以使用Atom、Brackets、VSCode等工具
像我这样喜欢钻牛角尖的人，想在Vim上也使用这个功能。 虽然可以实现几个插件，但是我决定选择别的方法。
我决定实现不依赖编辑器的方案。 基本的想法是运行本地服务器，监视文件的更改，并在每次文件更新时更新服务器上的页面。
虽然听起来很复杂，但实际上很简单，只需要在项目文件夹中安装和运行浏览器同步。
假设你已经安装了nodejs，所以只需要在全球范围内安装浏览器同步。
安装NPM install-gbrowser-sync浏览器- sync后，可以在任何文件夹中运行，创建本地服务器并自动显示文件夹中的index.html。
如果使用browser-syncstart---- server---files.Linux，bane可以创建别名来简化服务器的启动过程。 打开主目录中的. bashrc文件，添加以下内容：
# # commandlinealiastostartthebrowser-syncserveraliasserve=' browser-syncstart-- server-- files.' LAN中的其他机器在我的服务器上
# #浏览器-同步配置# getthecurrentlocalipaddressexportserver _ IP=`主机名称- I ` # thecommandaliastostartthebrowser-#
原文： 3359 dev.to/Fidel ve/using-vim-as-your-main-editor-for-we B-development-5 a73
作者： Fidel Sanchez-Bueno，化学工程师，自学成功的程序员。
正文是CSDN的翻译。 转载请注明出处。
【结束】