itsuki0927/skcode

SkCode = neovim + lua + vscode

SkCode

一个还不错的前端开发个人 Nvim 配置。

环境

1. neovim >= 0.8: 必须
2. lazygit: 可选

安装

git clone https://github.com/itsuki0927/SkCode ~/.config/nvim
nvim
:Lazy

效果

首页

文件树

自动完成

lsp

Code Actions

重命名

模糊搜索

Git Signs

Git Blame

Todo 高亮

indent-blankline

弹窗 + lazygit

如何实现像上面图片中的样式：

1. 使用的终端是 kitty + zsh（一开始使用过 iterm2，但是太卡了，感觉不是很流畅）。
2. 终端使用字体是 IBMPlex，可以在这里下载。
3. 默认配置是前端开发基本配置（你也可以自己魔改）。
4. 如果 cmp 的图标不生效，可以看看这个Issue

安装 Lsp 服务

因为会需要各种各样的 lsp，在 VsCode 中内置了这些 Lsp，但是在 Nvim 中你需要自己独立去安装。

// 默认的Lsp配置：在文件default_config.lua中
const lsp = {
  // 默认会启动的Lsp
  tsserver: true, // typescript
  cssls: true, // css
  cssmodules_ls: true, // css module
  jsonls: true, // json
  html: true, // html
  eslint: true, // eslint
  sumneko_lua: true, // lua
  tailwindcss: true, // tailwindcss

  // 不会启动的Lsp
  emmet_ls: false, // emmet
  marksman: false, // markdown
  rust_analyzer: false, // rust
  volar: false, // vue3
  vuels: false, // vue2
};

所以需要安装上面值为 true 的 Lsp 服务，设置为 false 表示不启用该 Lsp，可以自己去动态的设置某一个 Lsp 的开启和关闭，这取决于你。

所以我们需要安装上面的 Lsp 的服务

前端 Lsp 服务一般是 npm、yarn、pnpm 进行安装，这里我会展示 yarn 进行安装，至于 npm 和 pnpm 如何全局安装欢迎谷歌。

Lsp 服务	描述	yarn 安装
cssls、html、jsonls、eslint	前端常用四件套	yarn global add vscode-langservers-extracted
tsserver	typescript	yarn global add typescript typescript-language-server
tailwindcss	tailwindcss	yarn global add @tailwindcss/language-server
cssmodules_ls	css module	yarn global add cssmodules-language-server
volar	Vue3（设置volar = true）	yarn global add @volar/vue-language-server
vuels	Vue2（设置vuels = true）	yarn global add vls

关于如何安装其他的 Lsp，可以查看这个文档，输入你想安装的语言就可以了。

安装格式化

格式化我是使用的Prettier这个工具，如果你需要这个格式化工具只需要使用以下命令安装即可:

- npm: `npm i -g prettier`
- yarn: `yarn global add prettier`
- pnpm: `pnpm global add prettier`

默认设置的保存自动格式化，你也可以禁用掉这个行为。

如果你还想格式化 lua 语言，可以添加stylua具体安装办法在这里。

如果你还想安装其他语言的格式化，可以在这里找到更多资料，进行相对应的配置即可。

配置

键位配置

键位配置可以参看键位配置文件: mappings，或者查看对应插件的配置，它们有提供默认的键位配置。

你也可以使用<space>sk来查看/搜索键位配置。

自定义

添加 LSP

在添加 Lsp 服务之前, 请确保你安装了 Lsp 服务在本地, 具体可以查看lspconfig. 其次在plugins/lsp/install.lua进行添加.

直接安装的 Lsp

如果是直接安装的 Lsp, 只需要在core/default_config.lsp中添加即可.

比如说需要添加一个 python 的语言服务器。

第一步：安装 python 的 lsp

在这里找到 python 的 Lsp 服务，我这边找到 python 的 Lsp 是pyright。

所以在pyright 的 README中找到安装方法，可以看到这里的安装命令是pip install pyright。

第二步：在 nvim 配置开启 python 的 lsp。

-- core/default_config.lua
M.lsp = {
  servers  = {
    -- 添加 pyright
    pyright = true,
    -- 你可以使用false, 禁用某个lsp
    tailwindcss = false,
  }
}

这样子你就安装好一个 python 的语言服务器，其他语言类似。

需要传入参数的 Lsp

如果需要对 Lsp 服务传入参数, 上面两步的基础上添加两步。

1. 在 core/lsp/providers 文件夹下新建一个 xxx.lua。
2. 查看 core/lsp/install.lua 的 install_lsp 函数。

local install_lsp = function(lspconfig)
  local opts
  for server, enable in pairs(servers) do
    if enable then
      ------------- 在这里新添加一个if判断 ---------------
      if server == '新添加的 Lsp名称' then
        opts = skcode.merge(default_opts, require('core.lsp.providers.新添加的 Lsp文件'))
      ----------------------------------------------------
      else
        opts = default_opts
      end

      lspconfig[server].setup(opts)
    end
  end
end

这里我就不做演示了，可以看看 providers 下的文件和install_lsp函数就明白了。

添加插件

具体可以看看lazy.nvim 的 README就可以知道如何添加插件了。

功能插件

• Git: gitsigns.nvim.
• 注释: Comment.nvim.
• 文件树: nvim-tree.lua.
• 启动页: alpha-nvim.
• 包管理器: lazy.nvim..
• Lsp 配置: nvim-lspconfig.
• 自动完成: nvim-cmp.
• 模糊搜索: telescope.nvim.
• 弹窗: vim-floatrem.nvim.
• 自动补全括号: nvim-autopairs.
• 提供格式化、诊断: formatter.nvim.
• 管理 tabs、buffers: bufferline.nvim.
• 调用函数显示函数签名: lsp_signature.nvim.
• 几个常用的文件快速跳转: harpoon.nvim.

UI 插件

• 主题: base64.
• 图标:nvim-web-devicons.
• 缩进线: indent-blankline.nvim.
• 状态栏: feline.nvim.
• Todo 高亮: todo-comments.nvim.
• 语法高亮: nvim-treesitter.
• 颜色高亮:nvim-colorizer.

为什么不用 vscode ?

1. 当习惯了 vim 之后, 双手可以不用离开键盘去打字真的很舒服, 它不会打乱你的思考逻辑, 特别是如果你有自己的一套工作流, 它的速度会想象不到的快.

2. vscode + nvim, 我之前尝试过, 但是这样子你得去尝试解决 vscode 键位冲突, 还得去学习 vscode 额外的配置等等一系列操作, 这个成本是很高的.

感谢

1. LunarVim
2. Neovim-from-scratch
3. VapourNvim
4. NvChad
5. Neovim IDE from Scratch with ChrisAtMachine
6. Neovim Lua From Scratch with Neil Sabde

一些小想法

从 20 年开始接触 vim, 一开始可能是为了装逼, 后面发现 vim 还是挺不错的, 特别是用熟了之后形成了自己的工作流, 要方便很多. 我没有学过 vimscript, 基本上 所有的插件都是看的官方文档或者别人的配置文件, 所以就属于直接拿代码的状态, 没有去好好去研究过, 后面接触到了可以使用 lua 来配置, 寒假在家没事做, 于是学习了一下 lua 来配置 vim , 我一直认为最好的学习是写代码、借鉴优秀的代码 .

最开始看的 lua 配置的 vim 是LunarVim, 当时才不到几百 star, 转眼间现在已经 7k star 了, 我的 vim 配置是从这个库的作者ChristianChiarulli他身上学到的, 然后最近他开了一个新的仓库, 讲解就是如何使用 lua 一步步配置 vim: Neovim-from-scratch, 所以一开始我在不断的做加法, 然后在学习他的配置时又看到了另外一个库VapourNvim, 这个更加的简单易上手, 他们都有配套的视频, 这是我觉得最棒的地方, 就在这样子的一点点看视频+看官方文档+看他们配置之后, 我的 SkCode 有了第一版.

而最终 SkCode 是根据 NvChad(它是一个优秀且支持拓展的 nvim lua 配置)"抄袭"而来, 你可以理解成 SkCode 它的代码都来源于这个仓库. SkCode 的代码结构是来源于 NvChad, 但是 SkCode 也绝不是简简单单的抄代码, 我希望 nvim 的配置更加简单, 所以将一些代码进行优化, 删除不需要的功能, 添加人性化的键位绑定, 以及提供前端的 Lsp 配置, 于是就出现了 SkCode.

skcode's Issues

有么有办法能离线安装？

求问一下楼主如果在服务器上部署的话，nvim+PackerSync总是failed to update，有么有什么办法能离线部署呢？

有python支持吗

有python支持吗

LSP 的代码提示 icon 似乎有问题

如图，在使用了 nvim-web-devicons. 要求的字体后，文件目录能正常显示 icon，但是 LSP 的代码提示却仍会出现丢失的 icon，该如何解决呢？请赐教～

安装 后 Failed to run `config` for nvim-lspconfig

neovim 0.10
安装提示
Failed to run config for nvim-lspconfig

...hare/nvim/lazy/schemastore.nvim/lua/schemastore/init.lua:92: schemastore.json.schemas(): select: schema not found: GitHub issue forms

stacktrace:

• /schemastore.nvim/lua/schemastore/init.lua:92
• vim/shared.lua:0 in tbl_map
• /schemastore.nvim/lua/schemastore/init.lua:90 in schemas
• nvim/lua/core/lsp/providers/jsonls.lua:10
• nvim/lua/core/lsp/install.lua:27 in install_lsp
• nvim/lua/core/lsp/install.lua:37
• nvim/lua/core/lsp/init.lua:2
• nvim/lua/core/plugin/list.lua:108 in config
• nvim/lua/core/plugin/list.lua:3
• ~/workspace/nvim/SkCode/init.lua:7

调用 lua 时出错?

我的用户名是FBIK, 我将仓库内的文件克隆到C:\Users\FBIK\AppData\Local\nvim, 之后输入nvim +PackerSync, 结果如下:

Cloning packer ..
Error detected while processing C:\Users\FBIK\AppData\Local\nvim\init.lua:
E5113: Error while calling lua chunk: C:\Users\FBIK\AppData\Local\nvim/lua/core/plugin/init.lua:26: Vim(packadd):E919:
Directory not found in 'packpath': "pack/*/opt/packer.nvim"
stack traceback:
        [C]: in function 'cmd'
        C:\Users\FBIK\AppData\Local\nvim/lua/core/plugin/init.lua:26: in function 'bootstrap'
        C:\Users\FBIK\AppData\Local\nvim\init.lua:6: in main chunk
Error detected while processing command line:
E492: Not an editor command: PackerSync
Press ENTER or type command to continue

请问这是什么情况? 我该如何解决?

你的目录压根就没有plugins啊，怎么添加插件？

ToggleTerm 载入不成功

 _LAZYGIT_TOGGLE()
 _RANGER_TOGGLE() 

这两个方法未找到

ln了你的配置文件后编辑保存时报failed to run formatter stylua.

看到这个搜索了下发现是缺少styluat程序导致，麻烦再更新下使用说明，让使用帮忙更友好些。

brew install stylua

另外发现vim自带用于快速翻页映射用在了harpoon上，想问下你平时用啥快捷键呢？

treesitter 报错

我还特地确认了下库，应该是没有问题的。

packersync 也是正常的。

唯独不正常的是大量报错。lsp已经全数禁用。确实不太熟悉treesitter。看了下配置文件，还不太方便简单禁用掉插件...虽然最后决定把plugin配置的setup注释掉解决了。系统耦合度太高也许并不是一件好事。？

无效的表达式 v:lua.require('ui.statusline').run()

不太懂 lua 语法，是否哪里有问题？
nvim 版本：0.9.1

安装完成后，缺少部分 language-server

Spawning language server with cmd: vscode-eslint-language-server failed. The language server is either not installed, missing from PATH, or not executable.

lsp报错

我按你的文档，通过yarn全局安装了lsp，还是报错

close_buffer 采用 :bd<CR> 在某些情况下 会退出 neovim

我看到 nvchad 已修改 close_buffer 的方法

https://github.com/NvChad/NvChad/blob/76d194b1414d2351364ef1a84672e6b95110b65a/lua/core/utils.lua#L4-L117

不知道大家有没有谁遇到过现在所使用的 :bd<CR> 这种 <leader>x 会退出程序的情况

安装下来运行，报错了~

请问下大佬，这个问题该怎么解决？

Error executing vim.schedule lua callback: vim/_meta.lua:324: Invalid option type 'nil' for 'shada
file', should be string or table
stack traceback:
        [C]: in function 'error'
        vim/_meta.lua:324: in function 'assert_valid_value'
        vim/_meta.lua:393: in function 'convert_value_to_vim'
        vim/_meta.lua:681: in function '_set'
        vim/_meta.lua:724: in function '__newindex'
        /Users/demigodliu/.config/nvim/lua/core/options.lua:76: in function </Users/demigodliu/.co
nfig/nvim/lua/core/options.lua:75>

Not an editor command PackerSync

E15: Invalid expression: v:lua.require('ui.statusline').run()

报错E15: Invalid expression: v:lua.require('ui.statusline').run()，google后找到相关的issue ，nvChad似乎解决了这个问题，但在SkCode中依旧会出现。
bug发生的时间：在第一次从nvim-tree中打开js文件时出现
系统：win11
截图：

請問關於一些亂碼的問題

在你的網站中有這麼一張圖片

可以看到每個選項前面的 icon 都有出現

可是我的長這樣

前面的icon 像是亂碼，這是我有少裝了什麼東西或字體嗎？

功能增强：move.nvim插件，提供类似vscode alt+方向键快速移动代码

path:lua/core/plugin/list.lua

 --move-nvim 提供快速移动代码的插件
  {
    'fedepujol/move.nvim',
    lazy=false,
    init = function()
      require('core.mappings').move()
    end,
  }

path:lua/core/mappings.lua

--move.nvim mapping
M.move = function()
 local opts = { noremap = true, silent = true }
-- Normal-mode commands
vim.keymap.set('n', '<A-Down>', ':MoveLine(1)<CR>', opts)
vim.keymap.set('n', '<A-Up>', ':MoveLine(-1)<CR>', opts)
vim.keymap.set('n', '<A-Left>', ':MoveHChar(-1)<CR>', opts)
vim.keymap.set('n', '<A-Right>', ':MoveHChar(1)<CR>', opts)
vim.keymap.set('n', '<leader>wf', ':MoveWord(1)<CR>', opts)
vim.keymap.set('n', '<leader>wb', ':MoveWord(-1)<CR>', opts)
-- Visual-mode commands
vim.keymap.set('v', '<A-Down>', ':MoveBlock(1)<CR>', opts)
vim.keymap.set('v', '<A-Up>', ':MoveBlock(-1)<CR>', opts)
vim.keymap.set('v', '<A-Left>', ':MoveHBlock(-1)<CR>', opts)
vim.keymap.set('v', '<A-Right>', ':MoveHBlock(1)<CR>', opts)
end

move.nvim

你的telescope咋这么好看，有主题？

😃