WordPressのテーマやプラグイン開発者の方であれば、Node.jsの事は詳しく分からないけれど、Node.jsで動作するタスクランナーである「Grunt」や「gulp.js」を利用したことがあるという方は多いのではないでしょうか。タスクランナーを使用することで、「CSS/JSファイルのサイズ縮小」など、通常であれば一手間かかる作業をすべて自動化することができるため、覚えておいて損はありません。WordPress開発の高速化の手法として、はじめてのgulp.js！MacでCSSファイル、JavaScriptの圧縮を行おうで、Node.jsで動作するタスクランナーである「gulp.js」をご紹介しました。
Node.jsのパッケージ管理マネージャーであるnpm
冒頭の記事の中で、Node.jsのパッケージ管理マネージャーである、npm（Node.js Package Manager）について触れ、パッケージのインストールオプションである、「ローカルインストール」「グローバルインストール」（-g付与）についてご紹介しました。
また、gulpコマンドを実行するために、「グローバルインストール」を推奨していましたが、Node.jsの複数のプロジェクトを管理している場合、ローカルパッケージ（ローカルインストールでインストールしたパッケージ）と、グローバルパッケージ（グローバルインストールでインストールしたパッケージ）でバージョンの乖離が発生した場合、動作に支障をきたすことが多く、プロジェクトとしてはpackage.jsonにも記述可能なローカルパッケージを実行することが推奨されます。
npm 5.2.0より前のバージョンにおけるローカルパッケージの実行方法
従来のNode.jsのローカルパッケージの実行方法としては、以下の方法がありました。
- ./node_modules/bin/
- $(npm bin)/
package.jsonにnpm-scriptsを記述
また、パッケージそのものを、ローカルではなくグローバルパッケージとしてインストールして、コマンド指定で実行するという方法もありましたが、package.jsonから脱却することになり、かつローカルパッケージとグローバルパッケージのバージョン乖離等によって、問題が生じる可能性がありました。
npm 5.2.0からの新機能である「npx」コマンド
npm 5.2.0からnpxというコマンドがバンドルされるようになり、このコマンドを使用すると、従来の煩わしい実行方法は不要となりました。まずは、実行例をご覧ください。
npx gulp sass
冒頭にご紹介した記事中では、gulpコマンドを使用するために、グローバルインストールして使用していましたが、ローカルパッケージとグローバルパッケージでバージョンに乖離があると正常に動作しないため、ローカルパッケージのバージョンがグローバルパッケージに依存するという状態でした。しかし、npxコマンドを使用すれば、グローバルパッケージを必要とすることなく、かつ短い文法でローカルパッケージを実行できます。
npx gulp -v
また、npxコマンドに-vオプションを付与することで、パッケージをインストールすることなく、そのパッケージを実行できます。パッケージを試用してみたい場合にオススメです。実行後は、一時的にインストールされたパッケージは削除されるため、環境を壊さないのも魅力的です。
Cannot find module ‘../lib/completion’エラー
ローカルパッケージ実行時に上記のエラーが表示された場合は、該当のパッケージを再インストールしてみてください。
npm uninstall <Package Name> --save
npm install <Package Name> --save