目次
最近(最近でもないか?)、pnpmは多くの開発者に支持されているみたいです。
自分は面倒なのでnpmでそのまま行きたいのですが、移行せざるをえない感じになってきたので備忘録。
pnpmのインストール
まずは、pnpmをインストールする必要があります。
以下の手順でインストールします。
Node.jsのインストール
npmから移行する場合は入っていると思いますが念のため。
pnpmはNode.jsに依存していますので、まずNode.jsをインストールします。
Macの場合Homebrewを使ってインストールするのが簡単です。
ターミナルを開いて以下のコマンドを入力します。
brew install node
きちんとインストールされたかは、下記のコマンドで確認します。
node --version
バージョン番号が表示されれば、Node.jsは正常にインストールされています。
pnpmのインストール
Node.jsがインストールされたら、次にpnpmをインストールします。
以下のコマンドを実行します。
npm install -g pnpm
きちんとインストールされたかは、下記のコマンドで確認します。
pnpm --version
バージョン番号が表示されれば、pnpmは正常にインストールされています。
プロジェクトのセットアップ
pnpmがインストールできたら、次は新しいプロジェクトをセットアップします。
プロジェクトディレクトリの作成
任意の場所に新しいプロジェクト用のディレクトリを作成します。
ここでは例としてプロジェクト名をmy-projectとします。
mkdir my-project
cd my-project
プロジェクトの初期化
プロジェクトを初期化するために、以下のコマンドを実行します。
pnpm init
このコマンドを実行すると、いくつかの質問が表示されるので、必要に応じてプロジェクト名やバージョンなどを入力してください。
TypeScriptの設定（オプション）
TypeScriptを使用する場合は、以下の手順で設定を行います。
TypeScriptのインストール
pnpmを使ってTypeScriptをインストールします。
pnpm add -D typescript
tsconfig.jsonの作成
TypeScriptの設定ファイルを作成します。
以下のコマンドを実行して、デフォルトの設定を生成します。
npx tsc --init
依存関係の追加
プロジェクトに必要な依存関係を追加するには、以下のコマンドを使用します。
pnpm add <パッケージ名>
例えば、Reactを使いたい場合は次のようにします。
pnpm add react react-dom
プロジェクトの実行
プロジェクトを実行するためのスクリプトをpackage.jsonに追加します。
例えば、TypeScriptをコンパイルして実行する場合は、以下のように設定します。
"scripts": {
"build": "tsc",
"start": "node dist/index.js"
}
その後、以下のコマンドでプロジェクトを実行できます。
pnpm run build
pnpm start
