LazyVim开发vue2

news2024/11/18 2:34:35

neovim 0.5刚出来的时代,那时刚有lua插件我很狂热。每天沉迷于打造自己的IDE之中。写过一堆相关的博客,也录过一些视频教程。后来发现neovim的接口和插件更新的很快,导致配置文件要不定期的修改,才能保证新版本的插件的适配。我也一直在更新,直到工作上的事情越来越多,导致我在也没有时间研究neovim,没时间更新了。为了高效的完成工作上的任务,我被迫使用了不需要折腾的IDE,比如:IDEA,VSCODE。我的neovim也一直保持着低版本。配置也不在更新了。

不知不觉NVIM v0.9.5 都出来了,是时候回到neovim玩玩了。只是现在的我,每天各种事情缠身,在也没有时间自己一点点研究vim插件,一点点组装自己的IDE了,我选择使用大佬们集成好的配置。这次我用LAZYVIM。

正如其名,我是真的懒的自己配置了。直接享受大佬的成果吧!以后有空了在深入研究一下吧。

安装方法Linux/MacOS

见官方文档:
http://www.lazyvim.org/installation

安装 LazyVim Starter

备份您当前的 Neovim 文件:

# required
mv ~/.config/nvim{,.bak}
# optional but recommended
mv ~/.local/share/nvim{,.bak}
mv ~/.local/state/nvim{,.bak}
mv ~/.cache/nvim{,.bak}

克隆启动器

git clone https://github.com/LazyVim/starter ~/.config/nvim

删除该文件夹,以便稍后可以将其添加到自己的存储库中.git

rm -rf ~/.config/nvim/.git

启动Neovim!

nvim

参考文件中关于如何自定义 LazyVim 的注释。

是否要自定义配置

此次我打算尽可能的使用LazyVim的默认配置,尽量不做修改。主要目的是想了解一下别的人配置,深入体验一下哪种会更好。

键盘映射

LazyVim 使用 which-key.nvim 来帮助你记住你的 键盘映射。只需按任意键,您就会看到一个弹出窗口,其中包含所有 可能以 开头的键盘映射。<space><space>
在这里插入图片描述

  • 默认值为<leader><space>
  • 默认值为<localleader>\

详情的说明见:
http://www.lazyvim.org/keymaps

<C-Up>增加窗口高度n
<C-Down>降低窗口高度n
<C-Left>减小窗口宽度n
<C-Right>增加窗口宽度n

这里我就遇到问题了,因为我用的macOS系统这几个按钮被系统切换虚拟桌面用了。
为了适应这个我把系统的快捷键暂时禁用了。
在这里插入图片描述
按键适应起来还是有点不习惯的。我要强行要求自己适应下来,主要我感觉一些默认的按键设置的还是很讲究的,很合理。

忍不住想修改的地方

主题

上面说了,想尽可能适合这一套配置。有一些地方我经过思考还是要修改的。
首先是主题,我感觉默认的主题蓝色的字体太多了,个人不太喜欢过多的蓝色。

实现方法:
创建~/.config/nvim/lua/plugins/core.lua

return {
  -- add gruvbox
  { "ellisonleao/gruvbox.nvim" },

  -- Configure LazyVim to load gruvbox
  {
    "LazyVim/LazyVim",
    opts = {
      colorscheme = "gruvbox",
    },
  }
}

以上文本源于示例中的copy,正好gruvbox是我之前一直在用的主题感觉很不错。
还有craftzdog/solarized-osaka.nvim 这个主题也是不错的。

主题折腾以后,我还想试不同的主题。导致我精力分散。我决定还是用默认的主题。回归一切默认的原则。

按键

尽可能默认,实在忍不住修改的地方如下:
修改~/.config/nvim/lua/config/keymaps.lua在文件末尾增加。

local map = LazyVim.safe_keymap_set
map("i", "jk", "<Esc>")

主要在insert模式下用jk代替Esc太爽了,已经行成肌肉记忆。主要这个配置一般来说不会对别的按键影响。思考良久还是加上了。

LSP

vue智能提示的设置我花了1下午+1 上午才让自己满意。我的目标是开发体验能与vscode中类似最好。
我是刚用LazyVim的新手,所以不明白怎么搞就去项目的讨论区找相关的文章,比如:
https://github.com/LazyVim/LazyVim/discussions/2814
这个是可以用,但是用起来不是我想要的,比如:写<el并不会提示我想要的组件。

我在找了很久,没找到合适我的。与是我就想纯手动配置lsp。

手动配置

我本人其实对手动配置更熟悉一些,我之前做的nvim配置都是我一点点手动配置出来的。突然用这种全自己的配置我反而不会用了。与是我就打算手动试试,实在不行就暂时回到IDEA吧。
与是我找到了nvim-lspconfig的官方文档,地址如下:
https://github.com/neovim/nvim-lspconfig/blob/master/doc/server_configurations.md#vuels

这里提示一下node版本用18,反正我用12是不行的

安装vls

npm install -g vls

配置
~/.config/nvim/lua/config/lazy.lua 在末尾加入下面一行

require'lspconfig'.vuels.setup{}

就以上两步竟然直接可以了。

require'lspconfig'.vuels.setup{} 这一行放哪合适我在研究一下。放哪最优,有空时在优化一下。我想写到~/.config/nvim/lua/plugins之中,虽然能用,但是会有错误提示。

试用了一下,element-ui的组件都可以正常提示出来,我非常的满意。

自动配置

我本想手动我都会了,自动肯定更简单。只要执行以下命令就可以搞定

:MasonInstall vetur-vls 

当然输命令的方法不利于分享配置,写在配置里这样:
~/.config/nvim/lua/plugins/lsp.lua
内容如下:

return {
    {
        "williamboman/mason.nvim",
        opts = {
            ensure_installed = {
                "vetur-vls"
            },
        },
    }
}

不用做任何额外配置就可以直接使用了。网上很多教程都用的是vue-language-server 并不符合我的需求,不清楚是不是vue2.0与3.0的区别导致的。花了4,5个小时总算把这个解决了。不解决根本睡不着。

话说回来,这里是引用vetur-vls这个名称我怎么看都不像是vue的lsp 这个坑太浪费时间了。


以下是探索过程:

LazyVim的加载机制我还不太熟悉,比如:lsp安装后如何卸载之类的我都不会。

:Mason - opens a graphical status window
:MasonUpdate - updates all managed registries
:MasonInstall <package> ... - installs/re-installs the provided packages
:MasonUninstall <package> ... - uninstalls the provided packages
:MasonUninstallAll - uninstalls all packages
:MasonLog - opens the mason.nvim log file in a new tab window

我上去:MasonUninstallAll 把之前安装的全卸载了。
我发现打开一些类型的文件比如lua,竟然会自动安装lsp.
研究发下Mason关于vue的Lsp有两种

名称LSP
vetur-vlsvuels
vue-language-servervolar

不难看出我上面手动安装的是vuels安装命令应该是:

:MasonInstall vetur-vls 

而我之间错误的认为应该是:

:MasonInstall vue-language-server

这是一个坑啊,我本能的以为vue-language-server的缩写是vuels 从字面意思上讲是这样。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1594607.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

深入理解DES算法:原理、实现与应用

title: 深入理解DES算法&#xff1a;原理、实现与应用 date: 2024/4/14 21:30:21 updated: 2024/4/14 21:30:21 tags: DES加密对称加密分组密码密钥管理S盒P盒安全性分析替代算法 DES算法简介 历史 DES&#xff08;Data Encryption Standard&#xff09;算法是由IBM研发&…

llamafactory:unified efficient fine-tuning of 100+ lanuage models

1.introduction llamafactory由三个主要模块组成&#xff0c;Model Loader&#xff0c;Data Worker&#xff0c;Trainer。 2.Efficient fine-tuning techniques 2.1 Efficient Optimization 冻结微调&#xff1a;冻结大部分参数&#xff0c;同时只在一小部分解码器层中微调剩…

Python怎么算平方

Python怎么算平方&#xff1f;下面是算平方的三种方法&#xff1a; 方法一&#xff1a;使用内置模块 >>> import math >>> math.pow(12, 2) # 求平方 144.0 方法二&#xff1a;使用表达式 >>> 12 ** 2 # 求平方 144 方法三&#…

量子城域网系列(三):搭建一个点对点量子保密通信网络

各位小伙伴周末愉快呀&#xff0c;今天是4月14日世界量子日&#xff0c;至于为今天是世界量子日可以围观我之前的文章&#xff1a;关于世界量子日。 之前的文章中我们讨论了量子密钥在通信系统各层协议中的应用&#xff0c;那在实际工程中如何真正落地一个量子加密网络呢&a…

minikube环境搭建

&#x1f4d5;作者简介&#xff1a; 过去日记&#xff0c;致力于Java、GoLang,Rust等多种编程语言&#xff0c;热爱技术&#xff0c;喜欢游戏的博主。 &#x1f4d8;相关专栏Rust初阶教程、go语言基础系列、spring教程等&#xff0c;大家有兴趣的可以看一看 &#x1f4d9;Jav…

Jmeter杂记:测试计划参数详解

测试计划各参数详解 1&#xff0c;用户自定义变量&#xff0c;是全局变量&#xff0c;供所有线程组使用&#xff0c;可用配置元件&#xff1a;用户自定义变量替代 2&#xff0c;连续的运行线程组&#xff0c;默认不勾选&#xff0c;则随机的运行多个线程组中的取样器&#xff…

什么是享元模式,有哪些具体应用

一、定义 享元模式是一种通过尽可能多地共享数据来最小化内存使用和对象数量&#xff0c;从而提高性能的设计模式。在享元模式中&#xff0c;如果需要相同数据的多个对象&#xff0c;则共享这些对象而不是创建新的对象&#xff0c;从而提高系统的效率。 其实有很多应用场景&am…

spring-cloud-alibaba微服务Sentinel

Sentinel 官方网站 sentinel-dashboard-1.8.7.jar包下载地址 在window通过命令行启动&#xff08;java -Dserver.port8080 -Dproject.namesentinel-dashboard -jar sentinel-dashboard-1.8.7.jar&#xff09;&#xff0c;可以通过 -Dserver.port修改控制台的端口 使用的版本最好…

vue--双向数据绑定原理

Vue采用数据劫持 发布者-订阅者模式实现双向数据绑定&#xff0c;实现逻辑图如下所示&#xff1a; 数据劫持 Vue 借助Object.defineProperty()来劫持各个属性&#xff0c;这样一来属性存取过程都会被监听到 发布者-订阅者模式 主要实现三个对象&#xff1a;Observer&#…

docker 安装 nginx + httpd + php-fpm

原文地址&#xff1a;http://www.taoluyuan.com/index.php/archives/30/#2 展示 1.安装 1.1安装docker 1.2安装nginx 1.3安装apache-httpd 1.4安装php-fpm 2.配置nginx反向代理 httpdphp-fmp 1.安装 1.1安装docker 移除旧的版本&#xff1a; sudo yum remove docker 安装…

Java编程练习之多重继承

在Java中类不允许多重继承&#xff0c;但使用接口可以实现多重继承&#xff0c;因为一个类可以同时实现多个接口&#xff0c;这样可以将所有需要实现的接口放在implements关键字后&#xff0c;并使用英文逗号隔开&#xff0c;但这可能会在一个类中产生庞大的代码量&#xff0c;…

String类为什么是不可变类

为什么说String对象一旦创建&#xff0c;其值是不可修改的 在Java中将String设计成不可变的是综合考虑到各种因素的结果&#xff0c;需要综合考虑内存、同步、数据结构以安全方面的考虑。 String被设计成不可变的主要目的是为了安全和高效(效率)。 1&#xff09;字符串常量池…

LeetCode第22题:生成括号【22/1000 python 递归|动态规划】

作者介绍&#xff1a;10年大厂数据\经营分析经验&#xff0c;现任大厂数据部门负责人。 会一些的技术&#xff1a;数据分析、算法、SQL、大数据相关、python 欢迎加入社区&#xff1a;码上找工作http://t.csdnimg.cn/Q59WX作者专栏每日更新&#xff1a; LeetCode解锁1000题: 打…

从零自制docker-10-【cgroup进行容器资源限制】

文章目录 目的导入包的相关公开原则当前进程的挂载信息deferfor scanner.Scan()判断字符串包含新建的cgroup的默认文件cpu相关配置对应到ubuntu 22.04版本的cpu相关配置top注意查看你可使用的cpu注意坑启动后的top查看显示进程使用的cpu序号代码结果 目的 启动容器时通过-mem、…

Vol.45 这个壁纸网址,功能简单,每月37.7万访问量

哈咯&#xff0c;大家好&#xff0c;我是欧维&#xff0c;今天要给大家分享的网站是&#xff1a;极简壁纸&#xff0c;一个专门做电脑壁纸的网站&#xff1b; 它的网址是&#xff1a;极简壁纸_海量电脑桌面壁纸美图_4K超高清_最潮壁纸网站 网站的壁纸质量很高&#xff0c;页面…

Java 模块化开发

前言 之前在 Github 下载的好多代码发现都是 Java 模块化开发出来的&#xff0c;模块化是 JDK9 引入的&#xff0c;所以在 JDK9 及其后续的版本中&#xff0c;都可以采用模块化开发的方法来进行项目的开发。尤其是Java桌面应用开发&#xff0c;虽然这只是我的一个业余爱好&…

WindowsServer 2022 AD域控-006-安装副域控

试验拓扑图&#xff1a; 一、测试单域控故障&#xff0c;用户无法修改密码&#xff1b; 域控断网&#xff0c;Win10测试; 二、WindowsServer2022 DC02加入域控&#xff1b; 加入成功 此时域控上只有DC02这台服务器&#xff0c;但DC02并不是域控&#xff1b; 三、WindowsS…

防汛物资仓库管理系统|实现应急物资仓库三维可视化

系统概述 智慧应急物资仓库可视化系统&#xff08;智物资DW-S300&#xff09;采用了 B/S 架构的设计&#xff0c;通过浏览器即可快速登录操作。实现对库房内的应急物资从申购入库、出库、调拨、库内环境监测、维修保养、检测试验、处置报废等全周期、科学、规范的管理。系统以…

使用DockerCompose安装Redis

本文使用docker-compose的方式安装Redis&#xff0c;如何未安装docker-compose&#xff0c;可以参考这篇文章进行安装【在Ubuntu上安装Docker Compose】 一、创建一个DockerCompose配置文件 第一步&#xff1a;创建相关目录文件 为了更好的组织管理Docker容器的配置文件和映射…

python linux服务器ssh简单爆破(测试用户名密码)(连接ssh服务器)(测试登录ssh服务器)

文章目录 背景示例代码代码解释导入模块SSH服务器的地址和端口用户名和密码列表生成所有可能的用户名和密码组合尝试连接到SSH服务器并验证用户名和密码遍历并测试每一对凭证 背景 我们华为摄像头linux终端的密码忘了&#xff0c;还不太好初始化&#xff0c;手动一个个测试太麻…