强大的JavaScript工具管理器Volta

简介: 强大的JavaScript工具管理器Volta

前言


昨天在看webstorm的更新日志时,发现它添加了对Volta的集成,第一眼看到时比较好奇这是个啥,于是就第一时间上手体验了一波。


经过一番摸索后,知道了它的作用以及解决了哪些开发痛点,本文就跟大家分享下这个强大的JavaScript工具管理器Volta[1]的安装与使用,欢迎各位感兴趣的开发者阅读本文。


环境搭建


Volta使用rust开发,没有任何外部依赖项,安装起来特别容易。


在macos与linux系统上安装


打开终端,执行如下所示的命令:


curl https://get.volta.sh | bash


安装成功后的界面如下所示:

640.png

                                 image-20220412221024653


细心的开发者可能已经发现,安装完成后volta命令还无法使用,这是因为添加到环境变量中后,还未生效,我们需要执行如下所示的命令来让其生效:


source ~/.bash_profile


最后,我们再次执行volta命令它就可以正常使用了。


640.png

                                    image-20220412222000931


在Windows系统上安装


在Windows上安装需要下载: volta安装包[2],按照提示安装即可。


640.png

                   image-20220412222601999


一直点next即可完成安装,我们打开cmd或者powershell执行volta指令来验证下是否生效,如下所示:


640.png

                             image-20220412222945842


使用场景


环境搭建完毕之后,接下来我们看下它的使用场景。


在项目中管理全局JS包版本


对于前端开发者来说,打交道最多的就是Node与各种包管理工具(yarn、pnpm等等),此时你作为一个团队的技术领导,想统一团队成员电脑上安装的软件包版本,通常做法就是将运行项目所需的版本号写进README.md文件中,团队成员自己来安装对应版本的软件。


这种方法显然是不爽的,当有多个项目时,每个项目依赖的 node版本 都不一样,就需要每次打开项目看下该项目的版本号,手动去切换 node版本 ,降低了开发效率。

volta的出现解决了这个痛点,你只需要在项目的package.json中添加volta字段,写上版本号如下所示:


"volta": {
  "node": "14.16.0",
  "yarn": "1.22.17"
}


团队成员只需在他的电脑上搭建好volta的环境,启动项目即可顺利完成版本的切换🤓,如下图所示,我们分别在项目根目录和全局位置的终端执行了node --version,得到了不同的结果,就证明版本已经切换成功了。


640.png

                           image-20220412232649661


更多用法


在官方文档中,它还提供了更多的使用方法,你可以用它来充当你系统的JS包版本管理平台,用它来管理node、typescript、nest等等一系列基于JS开发的包。


我们最常用的就三个命令:


  • install 安装一个包,使用方法如下:
# @用于指定版本号,可忽略,忽略的话则默认安装最新版本
volta install node@12.11.1


  • list 显示当前项目使用的全局JS包版本号,使用方法如下:
volta list


640.png

                                  image-20220412234457717


  • pin 切换package.json中写的包版本号,使用方法如下:
volta pin node@12.11.1


image.png

                              image-20220412234333745

更多指令请移步官方文档:volta-reference[3]


写在最后


至此,文章就分享完毕了。


我是神奇的程序员,一位前端开发工程师。


如果你对我感兴趣,请移步我的个人网站[4],进一步了解。

  • 文中如有错误,欢迎在评论区指正,如果这篇文章帮到了你,欢迎点赞和关注😊
  • 文中链接可从文末参考资料中获取
相关文章
|
5月前
|
存储 自然语言处理 前端开发
抖音快手小红书虚拟评论截图生成器,模拟对话制作工具,html+js+css
这是一款纯前端实现的多平台虚拟评论生成器,支持抖音、快手、小红书风格,适用于产品演示与UI设计。采用Vanilla JS与Flexbox布局,利用IndexedDB存储数据,CSS Variables切换主题。
|
4月前
|
JavaScript 前端开发 API
淘宝店铺阿里旺旺采集工具,连接批量转旺旺ID,用Js接口实现效果
以下是淘宝店铺阿里旺旺采集工具的JS实现代码,包含批量获取店铺旺旺ID功能,当然仅
|
3月前
|
编解码 JavaScript 前端开发
如何在网页播放英文的m3u8文件(基于Javascript搭建的在线网页工具)
什么是m3u8?又该如何在网页中高效、便捷地播放英文的m3u8文件呢?今天这篇文章就带你一起了解,并推荐一种基于Javascript搭建的在线网页工具,让你轻松解决播放问题。
827 0
|
5月前
|
存储 前端开发 安全
病历单生成器在线制作,病历单生成器app,HTML+CSS+JS恶搞工具
本项目为医疗病历模拟生成器,旨在为医学教学和软件开发测试提供数据支持,严格遵守《医疗机构病历管理规定》。
|
5月前
|
存储 前端开发 JavaScript
仿真银行app下载安装, 银行卡虚拟余额制作app,用html+css+js实现逼真娱乐工具
这是一个简单的银行账户模拟器项目,用于学习前端开发基础。用户可进行存款、取款操作,所有数据存储于浏览器内存中
|
数据可视化 前端开发 JavaScript
可视化工具D3.js
可视化工具D3.js
420 2
|
6月前
|
人工智能 监控 前端开发
基于 Next.js 的书法字体生成工具架构设计与 SSR 优化实践
本项目是一款书法字体生成工具,采用 Next.js 14(App Router)与 Tailwind CSS 构建前端,阿里云 Serverless 部署后端。通过混合渲染策略(SSG/SSR/CSR)、Web Worker 异步计算及 CDN 字体分片加载优化性能。服务端借助阿里云函数计算处理计算密集型任务,将平均耗时从 1200ms 降至 280ms,支持 1000+ QPS。动态路由与 ARMS 监控提升工程化水平,未来计划引入 WebGPU 和 AI 字体风格迁移技术,进一步优化用户体验。
|
9月前
|
数据采集 JavaScript Android开发
【02】仿站技术之python技术,看完学会再也不用去购买收费工具了-本次找了小影-感觉页面很好看-本次是爬取vue需要用到Puppeteer库用node.js扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
【02】仿站技术之python技术,看完学会再也不用去购买收费工具了-本次找了小影-感觉页面很好看-本次是爬取vue需要用到Puppeteer库用node.js扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
388 7
【02】仿站技术之python技术,看完学会再也不用去购买收费工具了-本次找了小影-感觉页面很好看-本次是爬取vue需要用到Puppeteer库用node.js扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
|
12月前
|
JavaScript
如何使用内存快照分析工具来分析Node.js应用的内存问题?
需要注意的是,不同的内存快照分析工具可能具有不同的功能和操作方式,在使用时需要根据具体工具的说明和特点进行灵活运用。
383 62