neputa note

Ubuntu 22.04に最新のNode.jsとnpmをインストールする方法

初稿:

更新:

- 4 min read -

#Ubuntu #Node.js
img of Ubuntu 22.04に最新のNode.jsとnpmをインストールする方法

記事概要

  • Ubuntu22.04LTS on WSL2の環境に、Node.js、npmをインストールする
  • UbuntuリポジトリのNode.jsはバージョンが古いため、latestバージョンをインストールする手順をまとめる
  • 最後に、個人的な当初のNode.jsインストールの目的、PurgeCSS導入手順を備忘録として残す

作業環境

  • OS - Ubuntu 22.04LTS on WSL2
  • Node.js - v20.12.1
  • npm - v10.5.0

Node.js npm インストール作業詳細

参考サイト

事前作業

ubuntu-repository
$ sudo apt show nodejs
Package: nodejs
Version: 12.22.9~dfsg-1ubuntu3.4
Priority: extra
Section: universe/web
Origin: Ubuntu

古すぎる。

  • このことはMicrosoftのドキュメントにも記載されていた。

バージョン マネージャーをインストールする前に、ご利用のオペレーティング システムから Node.js または npm の既存のインストールを削除することをお勧めします。インストールの種類が異なると、奇妙で混乱を招く競合が発生する可能性があるためです。 たとえば、Ubuntu の apt-get コマンドを使用してインストールできる Node のバージョンは、現在期限切れになっています。 以前のインストールの削除に関するヘルプについては、ubuntu から nodejs を削除する方法に関するページを参照してください。 — WSL 2 上で Node.jis を設定する | Microsoft Learn

  • すでにubuntuのリポジトリでnode.jsのインストールを試みていたりした場合は削除しておく
bash
$ sudo apt purge nodejs
$ sudo apt autoremove

nvmをインストール

  • 以下コマンドでnvmをダウンロード＆インストールする
code
$ curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/master/install.sh | bash
  • wsl2を再起動
    • Windows Terminalであれば新しいタブを開き、既存を閉じる
  • 次のコマンドを実行し「npm」が返ってくることを確認する
    • ない場合はインストールできていないのでログを確認
bash
$ command -v nvm
nvm

node.jsをインストール

  • LTS（Long Term Support）の最新バージョンを以下コマンドでインストール
code
$ nvm install --lts
Installing latest LTS version.
Downloading and installing node v20.12.1...
Downloading https://nodejs.org/dist/v20.12.1/node-v20.12.1-linux-x64.tar.xz...
################################################################################################ 100.0%
Computing checksum with sha256sum
Checksums matched!
Now using node v20.12.1 (npm v10.5.0)
Creating default alias: default -> lts/* (-> v20.12.1)
  • インストールされたnode.jsのバージョンを確認
code
$ nvm ls
      -> v20.12.1
      system
      default -> lts/* (-> v20.12.1)

同時にインストールされたnpmのバージョンを確認

code
$ npm -v
10.5.0

本記事の主目的は以上。

以降は個人的な追加作業の備忘録を記す。

追加作業-1: sudo権限でも利用できるようシンボリックリンクを貼る

  • 以下記事を参考に作業を行う

【Linux】シンボリックリンクの作成,確認,変更,削除について解説｜YesNoCode

Linuxのシンボリックリンクの使い方がわからない・・・。そんな方向けに本記事ではシンボリックリンクの作成から確認・変更・削除方法まで簡潔に解説しております。

favicon for blog card engineer-life.dev

node、npm、n、それぞれのパスを確認する。

code
$ which node
/home/username/.nvm/versions/node/v21.7.2/bin/node
$ which npm
/home/username/.nvm/versions/node/v21.7.2/bin/npm
$ which n
/home/username/.nvm/versions/node/v21.7.2/bin/n

それぞれのパスにシンボリックリンクを貼る。（失敗した場合の変更、削除は先ほどのサイトで確認）

code
$ sudo ln -s /home/username/.nvm/versions/node/v21.7.2/bin/node /usr/bin/node
$ sudo ln -s /home/username/.nvm/versions/node/v21.7.2/bin/npm /usr/bin/npm
$ sudo ln -s /home/username/.nvm/versions/node/v21.7.2/bin/n /usr/bin/n

追加作業-2: PurgeCSSをインストール

以下コマンドでnode.jsとnpmのアップデートを行う。

code
$ sudo npm install -g n

added 1 package in 1s
$ sudo n stable
    copying : node/20.12.1
    installed : v20.12.1 (with npm 10.5.0)

PurgeCSSのインストール

code
$ npm install -g purgecss

参考サイト

#Ubuntu #Node.js

目次