この記事は以下のソフトウェアがMacにインストールされていることが前提となっています。
もしインストールされていない方は、一つ前の記事の2019年版Node-jsのおすすめインストール方法をご覧ください。
index.jsというJavaScriptファイルを実行する場合、以下のコマンドだけで実行できます。
node index.jsnpm install <モジュール名>でモジュールをインストールします。
が、ここで注意点です。
モジュールのインストール先は2つあります。
npm install <モジュール名>の場合は、Terminalで現在いる場所、ローカルディレクトリにインストールされます。
npm install <モジュール名> -gのように-gをつけるとグローバルインストールとなり、Node.jsのプログラムのある場所にインストールされます。インストールされたモーウールの場所はTerminalでnpm root -gを実行するとわかります。-gをつけた場合、Terminalでどの場所にいても再インストールせずにモジュールを使うことができます。
Terminalから直接実行するようなモジュールやいつでも使いたいモジュールの場合に使います。
インストールするとnode_modulesというディレクトリが作成され、その中にモジュールの実態がダウンロードされます。
JavaScriptファイルで以下を実行すると、モジュールを使うことができます。
const someModule = require('モジュール名');サンプルとして、puppeteerというモジュールをインストールし、サイト https://example.com のキャプチャを撮ってみましょう。
デスクトップにsampleというディレクトリを作り移動します。
cd ~/Desktop
mkdir sample
cd samplepuppeteerをインストールします。
npm install puppeteer同じ場所で、index.jsというファイルを作り以下を記述します。
const puppeteer = require('puppeteer');
(async () => {
const browser = await puppeteer.launch();
const page = await browser.newPage();
await page.goto('https://example.com');
await page.screenshot({path: 'example.png'});
await browser.close();
})();最後に実行しましょう。
node index.jsすると、同じディレクトリにexample.pngという名前のキャプチャー画像が生成されているはずです。
好きな名前のディレクトリを作成し、npmの初期化コマンドを使います。
mkdir test
cd test
npm init # これがnpmの初期化コマンドすると、プロジェクトの設定をどうするか、英語で対話的に質問されます。
質問内の()の中は初期値です。よくわからなければ、何も入力せずにEnterを押すと初期値で設定されていきます。
答えた内容は、このあと生成されるpackage.jsonというファイルに記載されます。
チップスとして、npm init -yと実行すると対話なしで、初期値で設定されたpackage.jsonがいきなり生成されます。
package.jsonの各プロパティは公式ドキュメント(英語)か翻訳されたドキュメントをご確認ください。
モジュールをインストールする際のnpm install <モジュール名>のコマンドに--saveオプションをつけると、依存モジュールのバージョン情報がpackage.jsonに追記されます。
puppeteerモジュールを設定したい場合は、以下のコマンドを実行します。
npm install puppeteer --save注意点として、--saveの他にも--save-devというオプションがあります。
インストールするモジュールがプロジェクトの開発時にのみ使用される場合は--save-devを、プロジェクトが実行されているときに使用する場合は--saveを使います。
--saveの場合はdependencies、--save-devの場合はdevDependenciesのプロパティ名で、package.json内に記述されます。
プロジェクトを配布する場合にとても重要なオプションです。
次は誰かが作成したプロジェクトを実行してみます。
Gitなどでプロジェクトをダウンロードした場合、node_modulesはファイル数とサイズが重く、Gitの管理から除外されており生成されません。
なので、まずプロジェクトのディレクトリにpackage.jsonがあることを確認し、以下のコマンドを実行しましょう。
node_modulesディレクトリが生成され依存モジュールがダウンロードされます。
npm installnpmのモジュールを使いたいではnpm install <モジュール名>とモジュール名を記入していましたが、モジュール名を省略するとpackage.jsonの記載されている依存モジュールがすべてダウンロードされます。
注意点として、ロックファイルがある場合は、必ずそのファイルに対応したコマンドを使います。
package-lock.jsonがある場合は、必ずnpm installを実行yarn.lockファイルがある場合は、必ずyarnを実行もしyarnをまだインストールしていない場合は、以下のコマンドでyarnをインストールしましょう。
brew install yarnpackage.jsonのscriptsというプロパティを使用します。
例えばindex.jsを実行する以下のコマンドを頻繁に使っているとします。
node index.jsこのショートカットを作成したい場合、package.jsonのscriptsの中に、"ショートカット名": "ショートカットしたいコマンド"を定義します。
{
"scripts": {
"start": "node index.js"
}
}このように記述すると、npm run <ショートカット名>でショートカットしたいコマンドが実行されます。
以下を実行すると、node index.jsが実行されます。
npm run startもしyarnで実行したい場合は、yarnのあとにショートカット名を入力するだけです。
yarn startこの記事の内容を覚えると、誰かが作成したプロジェクトでも、ドキュメントを見ずに簡単に実行できてしまうケースが多いです。
例えば、mikeyさんのreact-scaffoldというプロジェクトを試してみたいとします。
package.jsonのscriptsにstartという記述があるので、以下のコマンドを実行します。
git clone https://github.com/mikeyamadeo/react-scaffold
cd react-scaffold
yarn
yarn startすると、特にドキュメントなども見なくても、Webサーバーが立ち上がり、いつでも開発できる状態になります。
コードがオープンに公開されるこの時代、リポジトリの多いNode.jsを習得することはとても有意義なことです。
おすすめするのは、0からnpmのプロジェクト(パッケージ)を作ってみることです。
一つ一つ何が起こっているのか理解することで、誰かのパッケージを使う際や、エラーなどが発生した際に、その知識が役立ちます。