[解決済み] webpackコマンドが動作しない

質問

私はNode JsとWebpackの初心者です。私はモジュールローダーでプロジェクトを開始しようとしました。

まず、nodeJsとNPMをインストールし、新しいディレクトリとして tutorial . コマンドプロンプトを使ってこのディレクトリにcdし、次のコマンドを実行しました。 npm init でwebpackをインストールし npm を以下のコマンドで実行します。

npm install -S webpack

1つ目のコマンドで、プロジェクト内の「node-modules」ディレクトリ以下にwebpackをローカルにインストールしたので、これを実行することでプロジェクトを実行できるようになりました。

nodejs node-modules/webpack/bin/webpack.js

この場合の問題点は、私が自分の webpack.config.js ファイルを、プロジェクトのルートに配置したいこのディレクトリの中に置きます。

この問題の解決策の一つは、私のマシン上でグローバルにwebpackをインストールすることでした。私は以下のコマンドを使用して行いました。

npm install -g webpack

これで Webpack がインストールされ、Webpack コマンドが使えるようになりました。しかし、このコマンドは全く動作しないか、何もしていないようです。プロジェクトのルートディレクトリからこのコマンドを実行しても、まったく何も起こりません (スクリーンショットを参照)。

私が間違っていることを教えてください!

解決方法は？

webpack は、あなたの node-modules/webpack/bin/ ディレクトリにリンクされ、さらに node_modules/.bin .

あなたが持っているのは npm bin コマンドで、npmが実行ファイルをインストールするフォルダを取得します。

を使用することができます。 scripts プロパティを使用します。 package.json を使用して、エクスポートされるこのディレクトリから webpack を使用します。

"scripts": {
  "scriptName": "webpack --config etc..."
}

例えば

"scripts": {
  "build": "webpack --config webpack.config.js"
}

で実行すればいい。

npm run build

あるいは引数付きでも。

npm run build -- <args>

これによって webpack.config.js をプロジェクトのルートフォルダにインストールすることで、webpack をグローバルにインストールしたり、webpack の設定を node_modules フォルダーに格納されます。