怎么用前端开发工具nvim来代替VSCode安装配置

本文讲解"如何用前端开发工具nvim来代替VSCode安装配置",希望能够解决相关问题。

1. Neovim是什么

简单来说,neovim搭配各种插件可以最大限度的实现你平时使用VSCode的功能.

2. 我们为什么需要Neovim

客观原因, 想要减轻一下手腕负担,毕竟都要去医院检查了, 到了必须要重视的时候了.

至于很多大佬说的使用类vim这种编码方式可以提高工作的效率. 就我自己的体验而言,这个真没有.或许它让我极大的减少了使用鼠标的次数,极大的提高我敲字母的速度.但是这些一直都不是限制提高我工作效率的主要原因.

主要原因,是对于需求的理解,对于语言的熟悉度,对于API调用的熟悉度,对于编程思维逻辑的转化程度,更准确的说,是对设计模式在实际业务开发中合理的使用.

对于我这种菜鸟而言, 在使用vim之前, 思维的方式都还没跟上我敲键盘的速度????, 所以我编码的速度再快也没有用

其次, 通过键盘来操作,会带来快感.而且随着你熟练度的不停提升. 而且这个快感能够持续的时间很长,长到我使用了将近了两个月之后,每每想到要写代码的时候,还是会有兴奋感.

更重要的是,neovim自己从头开始配置的话,你会熟悉每一个功能,每一个自己设置的hot keybindings.这种如臂使指的感觉会更加强烈.

最后,相比vim, neovim更强的性能和更现代化的lua配置语言,当然这些是事实, neovim 带来的异步任务特性从逻辑上必然是会提升体验的,还有浮窗功能. 当然听说vim现在也有很多更新.但是我并不关心.

毕竟仅仅是neovim的颜值就可以不再看vim一眼了. 如下:

怎么用前端开发工具nvim来代替VSCode安装配置

颜值才是第一生产力

3. 如何配置Neovim

我逛遍了整个中文社区,只推荐在两个地方看如何从头配置Neovim.

一个掘金上面有一本且唯一一本小册也从头配置起了neovim. 另一个在知乎上面搜索 「Neovim IDE 搭建系列」即可.

当然也可以直接使用网上大佬的配置.

但是这些大佬的配置, 对于不熟悉lua的人来说,确实是够抽象的. 就算能够成功运行,也是一脸的懵逼.就达不到如臂指使的程度了,所以还是推荐有时间有精力的话,跟着教程自己从头配置一遍.

不得不说,确实很可能会消耗你不少的时间的.但是给你带来的影响,甚至会跟随你的整个职业生涯的.

只要是处理文字就有可能需要vim

系统的看可以去看掘金小册中neovim的教程,整个掘金就一个. 或者去看知乎上面. 这里就不画蛇添注了,只做一个简单的过程概要.

我当前的配置环境:

环境: MacOS Monterey 12.3

终端工具: iterm2

软件管理工具: HomeBrew

其实大差不差的,即使是在windows平台也是需要配置wsl2来进行环境的配置.配置逻辑基本相同

3.1 安装第三方终端

这里选择了使用人数最多的,有了疑问也容易搜索到. iterm2. 使用homebrew进行软件管理

  brew install iterm2

3.2 安装neoviem

  brew install neovim

homebrew的使用具体可以查看我的另外一篇文章

一般来说安装neovim是不会出问题的.但是要安装neovim的前置环境会劝退一批人.

你需要安装好nodejs、python环境, nodejs自不用说, 很多neovim的插件都是依托于python3环境的.

  brew install python3
  pip3 install neovim --upgrade

安装python模块之后,我们可以在终端中输入nvim就能够自动的进入到nvim的主页面. 此时输入:CheckHealth它就会自动检测你当天环境是否已经成功配置成功了.

当你看到全部是OK的时候,就表明已经配置成功了 . 即使出现了ERROR也不用害怕,它下面会给出建议,让你干啥你就干啥就好.

每个人电脑当前环境不一样,网络状况不一样,有时候确实会出现不一样的问题,这就需要你自己善于使用搜索功能了.在这里我推荐reddit中的r/neovim社区.

以下是我自己碰到的问题:

1.安装pip失败,提示: SyntaxError: invalid syntax

使用bootstrap教程

curl 'https://bootstrap.pypa.io/get-pip.py' > get-pip.py

接着使用python3执行该脚本

sudo python3 get-pip.py

静等它执行完成,随后在命令好中输入:

pip --version

出现如下截图说明,你的pip已经安装成功

怎么用前端开发工具nvim来代替VSCode安装配置

有了pip,就可以执行pip install neovim,让pyhon3和neovim产生关联

2. ERROR: This script does not work on Python 2.7 The minimum supported Python version is 3.6. Please use bootstrap.pypa.io/pip/2.7/get… instead

顾名思义,就是使用pyhon2.7版本不支持, 请下载bootstrap.pypa.io/pip/2.7/get…

3. Ruby provider (optional)的/usr/local/bin/neovim-ruby-host --version

运行如下命令可以解决:

gem install msgpack

3.3 快速启动neovim

cd ~ && vim .zshrc

然后找到空白地区,键入:

# neovim
alias vim='nvim'
alias vi='nvim'

之后你就可以直接在shell中输入vi或者vim就是使用的neovim了

3.4 创建neovim配置文件

mkdir ~/.config/nvim
vi ~/.config/nvim/init.vim

配置文件结果如下:

怎么用前端开发工具nvim来代替VSCode安装配置

init.lua 是所有功能的初始化

lua -> 配置文件下详情

lsp -> 提供代码识别功能,和vscode通用一套.

plugin-config -> 其他各种花里胡哨的配置, 功能性的、UI类型的都在里面

basic.lua -> vim基本配置文件

colorscheme.lua -> 其实属于plugin-config中的一员,但是主题是高频使用所以单独拎出

keybindings.lua -> 键位绑定

plufins.lua -> 插件引入入口

ginit.vim -> 我的终端模拟器neovide配置文件

pugin -> 自动生成

更具具体的配置内容,可以自己网上搜索

3.5 配置字体

字体是终端一切漂亮图标的基础. nerd font

地址在这里 www.nerdfonts.com/font-downlo…. 找一个自己喜欢的就行. nerd font是这些字体的超集.

需要注意的是, neovim的配置文件和终端模拟器都需要配置对应的字体

4. 终端模拟器之选

4.1 iterm2

优点: 网上的资料最多. 而且提供了可视化的UI配置. 配置起来也是最简单.功能也是最简单的.如果要使用thmux的话,甚至是有内置的.

缺点: 卡, 分屏多几个就卡得不行不行的, 即使配置了GPU加速也没有任何作用,现在已放弃.

4.2 alacrittty

A fast, cross-platform, OpenGL terminal emulator

优点: 快,简单

缺点: 太简单,没有tab, 你一次只能打开一个终端.

我的配置文件如下:

# Spread additional padding evenly around the terminal content.
dynamic_padding: true
# window customization
window:
dimensions:
  columns: 140
  lines: 38
# padding:
#   x: 0
#   y: 0
decorations: none
# Background opacity
opacity: 0.95
# mouse
mouse:
hide_when_typing: true 
scrolling:
history: 10000
multiplier: 3
# Font configuration
font:
normal:
  family: "SauceCodePro Nerd Font"
style: "常规体"
bold:
  family: "SauceCodePro Nerd Font"
  style: "粗体"
italic:
  family: "SauceCodePro Nerd Font"
  style: "斜体"
bold_italic:
  family: "SauceCodePro Nerd Font"
  style: "粗斜体"
# Point size
size: 14.0
offset:
  x: 0
  y: 5
glyph_offset:
  x: 0
  y: 0
use_thin_strokes: true
#
#builtin_box_drawing: true
# If `true`, bold text is drawn using the bright color variants.
draw_bold_text_with_bright_colors: true

文件放置于 .config/alacritty/alacritty.yml

4.3 kitty

优点: 快、使用过程中没有出现性能问题. 可以配置项很多. 缺点: 配置文件全英文,官方文档全英文,足够复杂 网上说之前说中文输入有问题,我是没有碰到. 而且也是快,没有性能问题. 现在完全作为顶替iterm2的存在 配置文件, 基本使用默认配置,改了如下:

font_family      BlexMono NF 
adjust_column_width -1
background_opacity 0.9
hide_window_decorations yes

第一个是为了连体字

第二个是kitty默认字体渲染间距偏宽,-1就正好

第三个背景来一点透明

第四个隐藏顶部title

4.4 Neovide

各种使用下来感觉就是alacritty的升级版.升级在了那些骚操作上面.我现在的开发项目的主力. 简单, 动画很流畅.掌控感有爽快感.

配置文件:

set guifont=BlexMono\ NF:h24
set listchars=tab:>~,trail:.
let g:neovide_refresh_rate=60
let g:neovide_no_idle=v:false
let g:neovide_fullscreen=v:false
let g:neovide_cursor_animation_length=0.13
let g:neovide_remember_window_size=v:true
let g:neovide_cursor_trail_length=0.5
let g:neovide_cursor_antialiasing=v:true
let g:neovide_cursor_vfx_mode = "torpedo"
let g:neovide_cursor_vfx_opacity=200.0
let g:neovide_cursor_vfx_particle_lifetime=1.2
let g:neovide_cursor_vfx_particle_density=7.0
let g:neovide_cursor_vfx_particle_speed=10.0
let g:neovide_cursor_vfx_particle_phase=1.5
let g:neovide_cursor_vfx_particle_curl=1.0

关于 "如何用前端开发工具nvim来代替VSCode安装配置" 就介绍到此。希望多多支持编程宝库

ahooks正式发布React Hooks工具库怎么使用:本文讲解"ahooks正式发布React Hooks工具库如何使用",希望能够解决相关问题。起因从 React Hooks 正式发布到现在,越来越多的项目正在使用 Function ...