强大的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],进一步了解。

  • 文中如有错误,欢迎在评论区指正,如果这篇文章帮到了你,欢迎点赞和关注😊
  • 文中链接可从文末参考资料中获取
相关文章
|
7月前
|
Web App开发 JavaScript 前端开发
JavaScript中的性能优化:代码优化技巧与性能分析工具
【4月更文挑战第22天】本文探讨JavaScript性能优化,包括代码优化技巧和性能分析工具。建议避免全局查找、减少DOM操作、使用事件委托、优化循环和异步编程以提升代码效率。推荐使用Chrome DevTools、Lighthouse和jsPerf等工具进行性能检测和优化。持续学习和实践是提升JavaScript应用性能的关键。
|
3月前
|
数据可视化 前端开发 JavaScript
可视化工具D3.js
可视化工具D3.js
104 2
|
26天前
|
Web App开发 JavaScript 前端开发
使用 Chrome 浏览器的内存分析工具来检测 JavaScript 中的内存泄漏
【10月更文挑战第25天】利用 Chrome 浏览器的内存分析工具,可以较为准确地检测 JavaScript 中的内存泄漏问题,并帮助我们找出潜在的泄漏点,以便采取相应的解决措施。
150 9
|
28天前
|
监控 前端开发 JavaScript
React 静态网站生成工具 Next.js 入门指南
【10月更文挑战第20天】Next.js 是一个基于 React 的服务器端渲染框架,由 Vercel 开发。本文从基础概念出发,逐步探讨 Next.js 的常见问题、易错点及解决方法,并通过具体代码示例进行说明,帮助开发者快速构建高性能的 Web 应用。
68 10
|
2月前
|
存储 JavaScript 前端开发
Node.js 常用工具
10月更文挑战第6天
25 2
|
7月前
|
JavaScript 前端开发 网络安全
【网络安全 | 信息收集】JS文件信息收集工具LinkFinder安装使用教程
【网络安全 | 信息收集】JS文件信息收集工具LinkFinder安装使用教程
363 4
|
7月前
|
JavaScript 前端开发 UED
在 JavaScript 中,异步编程和回调函数是处理非阻塞操作(如网络请求、文件读写等)的重要工具
【5月更文挑战第10天】JavaScript中的异步编程和回调函数用于处理非阻塞操作,提高应用响应性和吞吐量。异步编程通过回调函数、Promises和async/await等方式实现,避免程序因等待操作完成而阻塞。回调函数是异步操作完成后调用的函数,常用于处理网络请求等。然而,回调函数存在嵌套问题和错误处理困难,因此出现了Promises和async/await等更优解决方案。
50 3
|
2月前
|
Web App开发 JavaScript 前端开发
Node.js:JavaScript世界的全能工具
Node.js:JavaScript世界的全能工具
|
2月前
|
JavaScript 网络协议
Node.js 工具模块
10月更文挑战第7天
21 0
|
7月前
|
数据可视化 JavaScript 前端开发
【专栏】D3.js 和 Tableau 是两种流行的数据可视化工具
【4月更文挑战第27天】D3.js 和 Tableau 是两种流行的数据可视化工具。D3.js,一个JavaScript库,以其灵活性和定制性著称,适合创建复杂、个性化的可视化效果,但需要编程技能。Tableau,一款用户友好的分析软件,提供直观界面和强大分析功能,适合快速生成常见图表。在选择时,应考虑项目需求、团队技术能力、数据规模和性能要求。两者可单独使用,也可结合发挥各自优点。随着数据可视化需求的增长,这些工具将持续发展并提供更好的解决方案。
179 1
下一篇
无影云桌面