web-dev-qa-db-ja.com

インストールされているWebパックのバージョンを確認する方法

特にwebpack v1からv2への移行時には、プログラム的に webpack versionがインストールされているものを判断することが重要ですが、適切なAPIが見つからないようです。

50
doberkofler

webpack 4は現在使用可能なversionプロパティを提供しています

1
doberkofler

インストールされているバージョン

webpack CLI(--version, -v Show version number [boolean])を使う

webpack --version

または

webpack -v

npm list コマンドを使用する:

npm list webpack

name@version-rangeの結果:

<projectName>@<projectVersion> /path/to/project
└── webpack@<version-range>

ヤーンリスト コマンドを使用する:

yarn list webpack

プログラムでそれを行うには?

Webpack 2は 設定タイプ を導入しました。

設定オブジェクトをエクスポートする代わりに、環境を引数として受け取る関数を返すことができます。 webpackを実行するとき、--env--env.productionのように--env.platform=webでビルド環境キーを指定することができます。

--env.versionというビルド環境キーを使用します。

webpack --env.version $(webpack --version)

または

webpack --env.version $(webpack -v)

これが機能するためには、2つのことをする必要があります。

webpack.config.jsファイルを変更して DefinePlugin を使用します。

DefinePluginを使用すると、コンパイル時に構成できるグローバル定数を作成できます。

-module.exports = {
+module.exports = function(env) {
+  return {
    plugins: [
      new webpack.DefinePlugin({
+        WEBPACK_VERSION: JSON.stringify(env.version) //<version-range>
      })
    ]
+  };
};

これでグローバル定数にアクセスできます。

console.log(WEBPACK_VERSION);

利用可能な最新バージョン:

npm view コマンドを使用すると、レジストリで入手可能な最新バージョンが返されます。

npm view [<@scope>/]<name>[@<version>] [<field>[.<subfield>]...]


ウェブパックの場合:

npm view webpack version
83
Ricky

yarnを使用している人のために

yarn list webpackがうまくいくでしょう

$ yarn list webpack
yarn list v0.27.5
└─ [email protected]
Done in 1.24s.
14
gates

Angular CLI v7 +を使用している場合は、Webパックのバージョンがng versionの出力に表示されます。

-> ng version

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/


Angular CLI: 7.0.6
Node: 11.0.0
OS: darwin x64
Angular: 7.1.0
... animations, cdk, common, compiler, compiler-cli, core, forms
... http, language-service, material, platform-browser
... platform-browser-dynamic, router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.10.6
@angular-devkit/build-angular     0.10.6
@angular-devkit/build-optimizer   0.10.6
@angular-devkit/build-webpack     0.10.6
@angular-devkit/core              7.0.6
@angular-devkit/schematics        7.0.6
@angular/cli                      7.0.6
@ngtools/webpack                  7.0.6
@schematics/angular               7.0.6
@schematics/update                0.10.6
rxjs                              6.3.3
TypeScript                        3.1.6
webpack                           4.19.1
1
trebor

まだ言及されていないちょうど別の方法:

プロジェクトをローカルにインストールした場合は、node_modulesフォルダを開いてWebpackモジュールを確認してください。

$cd /node_modules/webpack/package.json

Package.jsonファイルを開き、バージョンを調べます。

enter image description here

1
Isaac Pak