V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
jenson47
V2EX  ›  Node.js

关于前端 node 多版本你是如何解决的,还有您是本地开发还是远程开发

  •  
  •   jenson47 · 105 天前 · 5448 次点击
    这是一个创建于 105 天前的主题,其中的信息可能已经有所发展或是发生改变。

    随着不同年代的项目,由于依赖的限制,有些支持的 node 版本比较低,有些又需要比较高。

    目前网上大家的解决方案:

    1. window nvm 多版本管理
    2. n

    如果我想要同时开多个项目的话,就比较麻烦,而且每次都得来回切换。 目前的我的开发都尽量避免在本地环境开发,毕竟没有几个公司能给你 64GB 的内存

    Docker 解决 Node 多版本问题

    优点:

    1. 再也不需要手动去切
    2. 将需求通过 Dockerfile 写好,后续只需要构建,构建的命令写成 shell ,比如我通过 Makefile
    3. 通过目录挂载解决模块缓存问题
    4. 由于在口罩期间,刚好可以结合远程开发

    缺点:

    1. 运行时得调用 docker 命令
    2. 还得配置一堆变量挂载,映射端口
    3. 尤其是后面的有些项目都不去认这个 PORT 环境变量了,得自行修改调整

    经过我这两年的项目实践,我将docker node 多版本操作进行了整理

    1. 将操作 docker 的命令这些封装成 shell
    2. 环境变量 刚好放到 .env.development中,比如后端 ip 域名,暴露端口等
    3. 运行,直接运行 shell 脚本,当然为了让脚本更简洁,我将常用的命令封装成 Makefile

    具体实例请查看:https://github.com/miss55/docker-node/blob/main/README-zh.md#%E4%BE%8B%E5%AD%90

    配合 vscode 的 Remote 扩展 进行远程开发

    搜索 vscode 扩展,关键字: Remote Development ,看着自己的需求添加相应的扩展即可

    具体教程可以参考vscode 官网的教程

    简单教程:

    1. 新开一个 vscode [ ctrl + shift + n ]
    2. 连接到服务器 [ ctrl + shift + p ] + [ connect to host ]
    3. 如果还没配置,则选择 Add New SSH Hosts 去添加即可
    4. 连接成功后,如果没有选择项目目录,则可以自行选择
    第 1 条附言  ·  101 天前

    大伙的解决方案 总结:

    前三是用的最多的

    1. fnm + win 界面用nvm-desktop
    2. nvm + .nvmrc
    3. volta
    4. Jetbrains WebStorm 可选node
    5. vfox
    6. mise
    7. 手动临时变更环境变量
    8. 虚拟机
    62 条回复    2024-07-30 14:49:42 +08:00
    BG7ZAG
        1
    BG7ZAG  
       105 天前   ❤️ 2
    命令行用 fnm
    win 界面用[nvm-desktop]( https://github.com/1111mp/nvm-desktop)
    amlee
        2
    amlee  
       105 天前   ❤️ 1
    docker 不是有 devcontainer 么
    jiuzhougege
        3
    jiuzhougege  
       105 天前
    nvm 香,就是不同项目需要的 pnpm 需要显式指定
    qiqw
        4
    qiqw  
       105 天前   ❤️ 1
    volta
    angrylid
        5
    angrylid  
       105 天前   ❤️ 1
    我用的 fnm ,不过这东西有个问题,就是有时候已经切到了新的 LTS ,但是 VSCode 的 Debugger 依然认为 path 里面的版本是 10 ,版本过旧无法 auto attach ,必须 Command + Q 强行重启
    foam
        6
    foam  
       105 天前 via Android   ❤️ 1
    开发阶段 nvm 完全没烦恼,不同项目放置一个自己的 nvmrc 文件,打开的时候 nvm use 。然后都能保持不同的 node 版本互不干扰。比 docker 好用多了。
    lingyired
        7
    lingyired  
       105 天前
    用的 nvs ,nvs 的 node 版本环境只在当前 cmd 窗口有效。也就是可以多个 cmd 同时使用多个 node 不同的版本。

    然后使用 Quicker 绑定了很多命令,每次打开 cmder ,就使用 Quicker 的单个快捷键输入多个命令,分别是:

    cd /path/to/project

    nvs use node/x.y.z/x64

    这样就进入刚项目的同时切换到对应的 node 版本了,这个 node 版本只在当前 cmd 窗口有效。
    wyl986
        8
    wyl986  
       105 天前
    用 vagrant 上虚拟机 homestead ,在 ubuntu 里面装 nvm ,nvm 会把 node/npm/yarn/pnpm/pm2 这些装到 /root/.nvm/${version}/node/bin 下面,启动项目的时候指定一下用的哪个 npm/yarn/pnpm 就可以了(你可以在 package.json 里面指明),这样可以实现同时运行多个版本的 node

    虽然是虚拟机,但是是命令行的,性能完全够的,一点也不卡
    smilingsun
        9
    smilingsun  
       105 天前 via Android
    Devbox 或者 nix shell ?
    blurethdao
        10
    blurethdao  
       105 天前 via iPhone
    一般不会有太多 node 版本装两个 wsl 就够用了
    aofall
        11
    aofall  
       105 天前
    我用的 Jetbrains WebStorm 开发的,可以在工程配置中自由选择 Node 解释器版本,平时一般用不上 nvm 来切换版本
    sunshower
        12
    sunshower  
       105 天前
    volta+1
    asdjgfr
        13
    asdjgfr  
       105 天前
    volta ,目前在 windows 上和 linux 上都没遇到什么问题
    jenson47
        14
    jenson47  
    OP
       105 天前
    @amlee Remote Development 套件确实有,不过有时候我就懒得重复配置,我希望在一个地方配置,其他地方就不关心。所以我专注放到 .env.development 配置
    yangg
        15
    yangg  
       105 天前
    本地开发 volta ,最能避免 lz 的手动切换问题
    body007
        16
    body007  
       105 天前   ❤️ 1
    我用 vfox
    mashpolo
        17
    mashpolo  
       105 天前
    用的 mise 来管理 node ,python ,go 等多版本的问题
    nzbin
        18
    nzbin  
       105 天前
    nvm ,本地开发,8G 内存,来回切换确实麻烦点,但是也能接受
    dcsuibian
        19
    dcsuibian  
       105 天前
    fnm ,也就是 Fast Node Manager 。这个很好用,可以在项目文件夹下面放一个.node-version 文件,这样 cd 进去时就自动切换到对应的版本了。
    waiaan
        20
    waiaan  
       105 天前
    volta+1
    darksword21
        21
    darksword21  
       105 天前 via iPhone
    nix
    emacs tramp
    faimin
        22
    faimin  
       105 天前
    volta +1
    8E9aYW8oj31rnbOK
        23
    8E9aYW8oj31rnbOK  
       105 天前
    我一直用虚拟机...
    Belmode
        24
    Belmode  
       104 天前
    手动临时变更环境变量
    otakustay
        25
    otakustay  
       104 天前
    有.nvmrc 不就会自动切版本了吗
    jenson47
        26
    jenson47  
    OP
       104 天前
    @foam
    @lingyired @otakustay 确实是我对 nvm 研究没那么深入,之前在 window 上出现切换需要权限问题,后面就放弃多版本切换,恰好当时还比较喜欢完 docker 就想着直接丢到 docker 上,如此以来需要什么依赖跟宿主机就没关系了,在一定程度上保证宿主机的干净
    IAmAnonymous
        27
    IAmAnonymous  
       104 天前
    node 小白问个问题,我引入一个库 npm install 之后
    162 vulnerabilities (1 low, 92 moderate, 66 high, 3 critical)

    然后 npm audit fix --force
    IAmAnonymous
        28
    IAmAnonymous  
       104 天前
    node 小白问个问题,我引入一个库 npm install 之后
    162 vulnerabilities (1 low, 92 moderate, 66 high, 3 critical)

    然后 npm audit fix --force

    变成
    8 vulnerabilities (2 moderate, 6 high)

    应该怎么解决
    zbowen66
        29
    zbowen66  
       104 天前
    @angrylid #5 不是有个命令叫 reload window 吗,可以试试
    n18255447846
        30
    n18255447846  
       104 天前
    用 prebuilt binaries 不就行了,把 node 命令换成绝对路径,想要哪个用哪个,
    n18255447846
        31
    n18255447846  
       104 天前
    @IAmAnonymous npm 常规操作,能跑没什么好解决的,无非就是一些包过时了或有一些安全问题被扫到了。

    非要解决就升级风险包到 latest ,不过升级是一件费力不讨好的事。另外如果最新的包还有安全问题,就换个。
    IAmAnonymous
        32
    IAmAnonymous  
       104 天前
    @n18255447846 其实只要能跑,不用管这个 vulnerabilities 是 low ,mediate, high, critical 是吗?谢谢
    mabelrussell
        33
    mabelrussell  
       104 天前
    asdf
    14
        34
    14  
       104 天前   ❤️ 1
    我是用 nvm ,在不同项目放不同的 .nvmrc 文件,.nvmrc 文件声明版本号,cd 到任意目录 nvm use 就能跑。
    然后在 packages.json 声明 engines 指定版本,这样忘记 nvm use 执行 npm 相关命令会报错。
    PrtScScrLk
        35
    PrtScScrLk  
       104 天前
    @14 感觉是个不错的方式,从 14 到现在的 20 ,版本问题其实挺头疼的,现在启动项目都要问一嘴用什么版本。显式的配置文件去声明版本是一个很好的方式呀哈哈哈
    FightPig
        36
    FightPig  
       104 天前
    一直用的 nvm ,以前觉得挺卡的,后来换成 fish 后觉得还行
    yagamil
        37
    yagamil  
       104 天前
    目前的我的开发都尽量避免在本地环境开发,毕竟没有几个公司能给你 64GB 的内存。

    远程开发我感觉还更加不爽。。。本地台式机器 64GB ,很容易呀。
    bxh8640123
        38
    bxh8640123  
       104 天前 via Android
    nvm + nvmrc + zsh vvm auto use
    Cbdy
        39
    Cbdy  
       104 天前
    直接把 node 安装到项目目录不就可以了吗?几行 shell 脚本的事儿
    可以参考 gradle 的 toolchains
    Heymans
        40
    Heymans  
       104 天前
    可以使用 vscode 的 dev container, 结合 docker 使用
    amlee
        41
    amlee  
       104 天前   ❤️ 1
    @14 为了方便,还以在 scripts 中加一个 predev 或 prestart 执行 nvm use
    Retas
        42
    Retas  
       104 天前
    nvm + 项目根目录 .nvmrc 声明版本 + shell 脚本检查当前目录 .nvmrc 文件自动切换 node 版本,个人体感最佳。接手新项目先问清 node 版本,狠狠地塞一个 .nvmrc 文件后面就全自动切换了
    supuwoerc
        43
    supuwoerc  
       104 天前
    volta
    yoshiyuki
        44
    yoshiyuki  
       104 天前
    用 nvm 装到系统路径里,不同项目内使用 webstorm 的 run config 来选定对应版本,要运行命令的时候就从图形化界面点一下 run
    ysc3839
        45
    ysc3839  
       104 天前
    我选择用 fnm ,包括 Windows 也用
    paradox8599
        46
    paradox8599  
       104 天前 via Android
    目前用的 vfox ,有多平台和多语言支持,不止 nodejs
    n18255447846
        47
    n18255447846  
       104 天前
    @IAmAnonymous 是的。node 包只要装成功了没输出 ERR 报错就能跑,npm 其实有个选项可以关闭 audit
    IAmAnonymous
        48
    IAmAnonymous  
       104 天前
    @n18255447846 哦哦,谢谢
    mgcnrx11
        49
    mgcnrx11  
       104 天前
    在使用 nvm 管理 nodejs 的版本之后,会发现 包管理器 的版本用 corepack 来做管理就会出现问题。在用 nvm 之后,npm 的版本会跟随 nodejs 版本切换而切换,但是 corepack 安装的 pnpm 缺无法自动切换了。

    导致的结果是可能会用上了不兼容的 nodejs 和 pnpm 版本。不知道有什么好的实践方式?

    能想到的是通过环境变量 COREPACK_HOME 来隔离不同的 corepack 安装路径
    ByteCat
        50
    ByteCat  
       104 天前
    以前用 nvm ,现在换 fnm 了,很好用。包管理器用 corepack 来管理
    zb1141920796
        51
    zb1141920796  
       104 天前
    @ByteCat corepack 是只要安装一个版本的吗?例如 pnpm ,我 node 切换不同的版本,Pnpm 的支持版本也是会变的吧,我现在 nvm 说是每切换一个 node 版本,pnpm 这些都是需要重新安装的
    ByteCat
        52
    ByteCat  
       104 天前
    @zb1141920796 我现在的用法是安装一个系统级 nodejs-lts ,这个可以通过包管理器比如 Windows 上的 scoop 来管理更新,然后用这个 node-lts 的 corepack 来使用 pnpm 或者 yarn 之类的,然后用 fnm 管理不同版本的 node 版本。
    thevita
        53
    thevita  
       104 天前
    asdf
    GuguDan
        54
    GuguDan  
       103 天前
    pnpm env use x.x.x -g
    miniaoes
        55
    miniaoes  
       103 天前
    volta ,node 版本锁死在 package.json 里会自动切换
    hi2hi
        56
    hi2hi  
       103 天前
    我目前是纯 node 在虚拟机里面写;小程序这种需要本地 UI 的,本地写; windows 下还是 nvm 切换。尽可能保证统一的 node 版本。
    LunaSeki
        57
    LunaSeki  
       103 天前
    用 vlota 显式 pin 一下对于多项目不同版本的场景比较方便
    ydfk
        58
    ydfk  
       103 天前
    volta+1
    多项目管理非常方便
    remember5
        59
    remember5  
       103 天前
    nvm 转到 vfox 了
    shintendo
        60
    shintendo  
       103 天前
    volta 暴打所有手动切版本和 CD 切版本
    unco020511
        61
    unco020511  
       102 天前
    我给你一个思路,同样的问题,gradle 的解决方案是 Gradle Wrapper,理论上应该有一个 node Wrapper 来自动处理这个事情
    giserman001
        62
    giserman001  
       95 天前
    @foam win 切换不了
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2495 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 30ms · UTC 10:35 · PVG 18:35 · LAX 03:35 · JFK 06:35
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.