出品
开源中国
经过7个多月的全职开发,Volar作者JohnsonChu宣布Volar1.0正式发布。据介绍,JohnsonChu为期7个月的全职开发工作由Vue作者尤雨溪提供资金。
Volar是Vue的VSCode插件,也是Vue的官方IDE/TS支持工具,除了集成Vetur的相关功能,如高亮、语法提示等之外,还包含一些独有功能。
这个主要版本全方面改进了工具,除了改进UX、性能、包大小,还发布了PluginAPIv1,以及重构了架构使核心代码与框架无关。
下面看一下重要变化。
功能更新
为Vite和Nuxt3Preview实现了GotoCode和HighlightSelectionDomElements
实现了ComponentPreview
新增format.initialIndent设置以指定SFCblocks的初始缩进
实现了WebIDE支持
不再内置支持template(在v1.0需要安装
volar/vue-language-plugin-pug)开箱即用改进
预设不再需要"jsx":"preserve",并且不会与
types/react冲突(除非明确启用vueCompilerOptions.jsxTemplates)预设总是以defineComponent()包装ComponentOptions
不再以警告色显示未知ComponentTag
改进JS组件中的TemplateTypeScript支持
减少对阅读README的依赖,现在会自动检测常见的项目设置问题(例如错误地设置vueCompilerOptions.target),发现问题时会在状态栏提示
UX/DX改进
启用Takeovermode不再弹出提示
更快的"ReloadProject"命令代替"RestartVueserver"
新的"ShowVirtualScripts"命令代替"WriteVirtualFiles"
增量更新过去的诊断结果防止烦人的闪烁问题
支持在不重启服务器的情况下添加或切换工作区
简化Namecasingtool在状态栏的显示方式,并且现在也支持Propnamecasing转换
TypeScript改进
支持了vue-tsc--watch
支持了InlayHints
支持FindFileReferences
支持了JavaScriptandTypeScriptNightly
解决了无法在Template引用类型的问题
新增vueCompilerOptions.strictTemplates选项支持更严格的Templatetypechecking,在使用未知的ComponentTag和Props时报告错误
性能改进
显著改进SourceMapmapping性能
实现SFCAST和TemplateAST的增量更新
简化Template生成的代码以降低了每个Vue文件产生的内存占用
为Monorepo多个TSproject共用TSSourceFile实例
移植了tsserver自动导入的缓存逻辑加快自动完成
移植了tsserver基于NamedPipe的CancellationToken实现以解决了LSP请求阻塞
优化Bundle降低包大小,并且插件启动速度更快
另外一些大型项目的性能问题可能是由于tsconfig包含了太多不需要的文件,我们还有一个新的**VSCode插件**用来检查你的tsconfig包含的文件。
通用的LanguageServer框架
Volar的核心代码现在与框架无关,你可以使用Volar为Vue以外的语言实现语言服务器。
在repo的examples目录,基于svelte2tsx分别实现了svelte-tsc,svelte-langauge-server等等示例。
目录中还有一个vue-and-svelte-language-server示例,在单个LanguageServer同时支持Vue和Svelte,避免多个LanguageServer建立分别建立昂贵的TypeScriptLanguageService实例,对于像Astro同时支持多个前端框架的项目可能很有用。
VueLanguagePluginAPI
现在支持vueCompilerOptions.plugins选项指定额外plugin来更改virtualcode的生成方式。
VueLanguagePlugin的codegenAPI使用muggle-string而不是magic-string,muggle-string仍然是早期版本缺乏主要功能,但是与Volar解耦因此可以独立发展,如果你需要开发VueLanguagePlugin请