💙
mise入門(1) Zenn執筆環境、viteフロントエンド開発環境の移行
はじめに
これまでWSL2上でPython/Node.jsの開発環境を構築していたが、mise/uv/nodeへと移行することにした。
まずはZennの記事執筆環境、viteフロントエンド開発環境を移行する。
前提として、どちらも既にrepositoryがGithubに存在している。
Install Git for Windows
以下のいずれかのウェブサイトからインストーラをダウンロードしてインストールする。
どちらからダウンロードしても同じ。
次にGithubからZenn記事のリポジトリ、viteフロントエンドプロジェクトのあるリポジトリをクローンする。
C:\Users{ユーザ名}.ssh\config
Host github github.com
HostName github.com
IdentityFile C:/Users/{ユーザ名}/.ssh/id_rsa #ここに自分の鍵のファイル名
User git
Install mise on Windows
mise公式の通り、winget install jdx.mise
でダウンロードする。
Zennの起動
mise install node@20
mise use node@20
mise activate
mise exec node@20 -- npx zenn preview # 既存の起動コマンドを呼び出す。以下の通り設定すると簡略化できる。
※Nodeのバージョンが古いが、追々先月リリースされたv24へのアップグレードをしたい。
mise.tomlファイルに以下の通り追記する。
[tools]
node = "20"
; ここから下
[tasks.preview]
run = "npx zenn preview"
すると、以下のコマンドでZennを起動できる。
mise run preview
viteプロジェクトの起動
mise install node@20
mise use node@20
mise activate
mise exec node@20 -- npm install
mise exec node@20 -- npm run dev # 既存の起動コマンドを呼び出す。以下の通り設定すると簡略化できる。
mise.tomlファイルに以下の通り追記する。
[tools]
node = "20"
; ここから下
[tasks.dev]
run = "npm run dev"
すると、以下のコマンドでviteフロントエンドプロジェクトを起動できる。
mise run dev
おわりに
まずはZennの記事執筆環境をmiseに移行できた。
なお、Node.jsからBun/Denoへと移行することも頭をよぎったが、一旦はmiseへの移行に焦点を絞ってNode.jsを使うことにした。
Discussion