備忘録_npm再入門 #npm

なんとなくの部分を文書化して知識整理

npmのヴァージョン確認

npm -v

パッケージインストール & アンインストール

アプリケーション用にインスール

カレントディレクトリに「node_modules」というディレクトリが作成される。
※インストールされたパッケージは「node_modules」ディレクトリに格納される

// インストール
$ npm install <パッケージ名>

// アンインストール
$ npm install <パッケージ名>

グローバルインストール

グローバルにインストールされる
※npm install -g <パッケージ名>でインストールされたパッケージは「package.json」に 記述されない

// グローバルインストール
$ npm install -g <パッケージ名>

// グローバルアンインストール
$ npm uninstall -g <パッケージ名>

一括インストールのフロー

設定ファイルの作成

「package.json」というファイルが作成される
※色々聞かれるがとりあえずenterでおk

// 通常設定
$ npm init

// 項目にデフォルト設定を適用
$ npm init -y

パッケージインストール + package.jsonへヴァージョン情報を記載

必要に応じでインストールするパッケージを--save-devで対応していくことで、
package.jsonに自動的に記述されていく

$ npm install <パッケージ名> --save-dev

一括インストール

パッケージ情報が記述されているpackage.jsonがある状態で、
下記コマンドを実行することで一括インストールされる

$ npm install

インストール済みのパッケージを確認

// アプリケーションごと
$ npm list

// 1階層目だけを表示させたい時
$ npm list -depth=0

// グローバル
$ npm list -g

パッケージ管理

// 対象パッケージのHPへ
$ npm home <パッケージ名>

// 対象パッケージのリポジトリへ
$ npm repo <パッケージ名>

// 対象パッケージのドキュメント
$ npm docs <パッケージ名>

// バグ一覧(現在)
$ npm bugs <パッケージ名>

// パッケージのアップデートの確認
$ npm outdated

// グローバルにパッケージを確認
$ npm outdated -g

// パッケージに関するもろもろ確認
$ npm view <パッケージ名>

// パッケージの現ヴァージョンとヴァージョン履歴の確認
$ npm view <パッケージ名> versions

オプションに関しての補足

--save

--saveオプションを実行するとpackage.jsonの「dependencies」に記載される。
「dependencies」に記載されているパッケージはnpm installした際に インストールされる。

$ npm install <パッケージ名> --save

$ npm uninstall <パッケージ名> --save

--save-dev

--save-devオプションを実行するとpackage.jsonの「devDependencies」に記載される。
「devDependencies」に記載されているパッケージはnpm installした際に インストールされない。

注意点

package.jsonを含むディレクトリ全体をGitHubなどからcloneして開発する場合、package.jsonのあるディレクトリでnpm installを実行すると「devDependencies」も特例的?にインストールされる。
※依存関係もインストールで対応する

$ npm install <パッケージ名> --save-dev

$ npm uninstall <パッケージ名> --save-dev

「dependencies」と「devDependencies」の使い分け

「dependencies」 : 実行時に必要になるもの
「devDependencies」: ビルド系ツール

パッケージの検索/確認

// 検索
$ npm search <パッケージ名>

// 詳細表示
$ npm show <パッケージ名>

パッケージを探す

npms : https://npms.io/
様々要素をもとにランク付け。
npm Discover : http://www.npmdiscover.com/
Aパッケージ使用している人は、Bも使ってます的な。
Packages by PageRank : http://anvaka.github.io/npmrank/online/
ソートして表示。

npmコマンドのショートカット

npm i => npm install
npm r => npm uninstall
npm i -S => npm install --save
npm i -D => npm install --save-dev
npm i -g => npm install -global

npm関連のパスの確認コマンド

// ローカルインストール先のディレクトリ確認
$ npm root

// ローカルインストール先の、コマンドディレクトリ(bin)確認
$ npm bin

// グローバルインストール先のディレクトリ確認
$ npm -g root

// グローバルインストール先の、コマンドディレクトリ(bin)確認
$ npm -g bin

依存オブジェクトのバージョンを固定

^ : バージョンアップは可能※メジャーアップデートは不可
~ : マイナーバージョンアップのみ

shrinkwrapコマンド

使用中の依存オブジェクトのバージョンが記述された「npm-shrinkwrap.json」ファイルが作成される。
「npm-shrinkwrap.json」ファイルが存在する場合はデフォルトとして使わる。
※npm installしたときには「package.json」を無視します。

$ npm shrinkwrap

-gを使わないという選択肢

コマンドのパスを通す。
-gでインストールすることでコマンドとして利用できるようになるがそれを避けるためにパスを通す

~/.zshrcなど

export PATH=$PATH:./node_modules/.bin

node_modulesディレクトリのbinディレクトリにパスを通すことで-gしなくてもコマンド使用可能。

correct機能の対応

gulp用にコマンドを通すことでグローバルにインストールしなくてもコマンドが使用できるようになるが、zshのcorrect機能がうざかったので解除(※環境がzsh)

一応やり方メモ

aliasに「nocorrcet」を設定
※あとは適当に順次追加すればおk

// gulpコマンドの場合
alias gulp='nocorrcet gulp'

参考にさせていただいているサイト様

https://www.webprofessional.jp/10-npm-tips-and-tricks/
http://qiita.com/Mic-U/items/cd456d6bea72937464f8