npmでnode.jsのpackageを管理する

  • 485
    いいね
  • 1
    コメント
この記事は最終更新日から1年以上が経過しています。

このTopicはWeb ApplicationのfrontendのProjectを管理するTopicの2つ目です。

  1. node.jsのversionを管理するためにnodebrewを利用する
  2. npmでnode.jsのpackageを管理する
  3. grunt.jsを使って、frontendのビルドを行う

前提条件として、僕の環境はMac OSです。

npmとは?

npmはnode.jsのpackageを管理するためのツールです。
node.js自体はJavaScriptで出来たWeb Serverですが、frontendを管理するためのtoolもたくさんあります。
npmはnode.jsのpackageを管理すためのツールです。
Javaが分かる方は、mavenのようなものだと想像していただければ、分かりやすいかと思います。

npmでpackageをインストールする

npmでpackageをインストールするには、npm installを使います。
オプションなどは公式にありますので、その中からよく使うものをいくつか試してみたいと思います。
書いてあるcommandを実際に実行する場合は、適当な作業ディレクトリを作って、その中で実行するのが良いです。

npm install -g

command
$ npm install -g grunt-cli

-g オプションは指定されたpackageをグローバルな領域にインストールするcommandです。
version関係なく、どのprojectでも利用するようなpackgeをインストールする時に利用します。
上の例だと、grunt-cliをインストールしています。
grunt-cliについては次のTopicで利用しようと思っているpackageですので、今の段階ではそういうpackageをグローバルな領域にインストールされたのだなとだけ思っていてください。

npm init

command
$ npm init

name: (sample) sample
version: (0.0.0) 
description: 
entry point: (index.js) 
test command: 
git repository: 
keywords: 
author: sinmetal
license: (BSD) MIT

{
  "name": "sample",
  "version": "0.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "repository": "",
  "author": "sinmetal",
  "license": "MIT"
}

npm initは対話形式でprojectの初期設定を行うためのcommandです。
実行すると対話形式で項目を入力して、package.jsonを作成します。
package.jsonはprojectのpackageを管理するためのファイルです。
mavenで言うところのpom.xmlです。
package.jsonはnode.jsのlibraryを公開する時のファイルなので、licenseなどが入ります。
ただ、ここでは公開するlibraryを作っているわけではなく、開発環境としてnpmを使いたいだけなので、ほとんど削除してかまわないでしょう。
適当に項目を削ったのが、以下のpackage.jsonです。

package.json
{
  "name": "sample",
  "version": "0.0.0",
  "description": ""
}

適当に削った時に、よく最後のカンマを消し忘れるので、注意ですw

npm install --save-dev

command
$ npm install --save-dev grunt

--save-devはinstallしたlibraryの情報を自動でpackage.jsonに書いてくれるoptionです。

command実行後にnode_modules/gruntが増えていることが分かると思います。
-gオプションを付けずに実行した場合は、node_modulesにインストールされます。
projectごとに作られるわけですね。
gruntについては次のTopicで利用しようと思っているpackageですので、今の段階ではそういうpackageがインストールされたのだなとだけ思っていてください。
また、package.jsonにも変更が入っています。

package.json
{
  "name": "sample",
  "version": "0.0.0",
  "description": "",
  "devDependencies": {
    "grunt": "~0.4.1"
  }
}

devDependenciesが増えています。
devDependenciesというのは開発時のみ利用するlibraryのversionを管理します。
libraryとして公開するようなprojectだと、--saveになります。
今回追加したのはgruntですので、gruntが書かれています。

npm install

command
$ npm install

オプション無しで、npm installを実行すると、package.jsonの内容に従って、packageをインストールします。
試しに、node_modulesディレクトリを削除して、実行してみてください。
node_modulesが再度作成されて、gruntがインストールされるはずです。

おまけ

node_modulesはnpm installで自動生成されるディレクトリですので、VCSで管理する必要はありません。
gitを利用している場合は、.gitignoreに追加しておきます。

.gitignore
# for client side development
node_modules/