如何确定已安装的webpack版本

130

特别是在从webpack v1迁移到v2的过程中,程序化地确定安装了哪个webpack版本非常重要,但我似乎找不到相应的API。

8个回答

199

已安装的版本:

使用webpack CLI(--version, -v 显示版本号 [boolean])

webpack --version

或:
webpack -v

使用npm list命令:

npm list webpack

结果为名称@版本范围

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

使用yarn list 命令:

yarn list webpack

如何以编程方式执行?

Webpack 2引入了配置类型

你可以返回一个接受环境作为参数的函数,而不是导出一个配置对象。运行webpack时,您可以通过--env指定构建环境键,例如--env.production--env.platform=web

我们将使用一个名为--env.version的构建环境键。

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

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

为了使其工作,我们需要执行两个操作:

更改我们的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>]...]


对于webpack:

npm view webpack version

3
webpack没有能够返回其版本的API,我必须使用一个shell命令来获取版本信息? - doberkofler
1
这个在命令行中可以正常工作...但是如何在程序中实现呢?(也就是在脚本文件中) - Maurice
我已经包含了一种编程方式,可以提取webpack的版本并将其用作任何文件中的全局常量。 - Ricky Ruiz
好的,我必须输入 npx webpack --version - Paolo
@doberkofler已经给出了(现在正确的)答案,并且这个答案还被标记为正确答案!https://dev59.com/GVgR5IYBdhLWcg3wJ6pw#52143627你不能依赖于 webpack -v,因为它假设你当前shell中的webpack与程序中运行的webpack相同。 - KCE

24

还有一种方法尚未提到:

如果您在本地安装了它,则打开node_modules文件夹并检查webpack模块。

< /node_modules/webpack/package.json

打开package.json文件,查找版本号

输入图片说明


23
对于那些使用yarn的人来说,yarn list webpack就可以解决问题。
$ yarn list webpack
yarn list v0.27.5
└─ webpack@2.6.1
Done in 1.24s.

9

现在webpack 4提供了一个可用的version属性!


3
这意味着,无论您在哪里提供webpack变量(例如在设置/配置文件中),您只需调用webpack.version,就可以获得形式为“x.y.z”的版本字符串。 - KCE

9
如果使用Angular CLI v7+,则webpack版本将在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

3
在 Angular 10 中,ng version 命令不会列出 webpack。如果您正在使用 @angular-builders/custom-webpack 自定义 webpack 配置,请尝试运行 npm list webpack 命令,它将显示您所使用的 webpack 版本。 - Tony

5

In CLI

$ webpack --version
    
webpack-cli 4.1.0
    
webpack 5.3.2

在代码中(Node.js运行时)
process.env.npm_package_devDependencies_webpack // ^5.3.2

或者
process.env.npm_package_dependencies_webpack // ^5.3.2

在插件中

compiler.webpack.version // 5.3.2

4
webpack -v添加到您的package.json中:
{
  "name": "js",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "build": "webpack -v",
    "dev": "webpack --watch"
  }
}

接着在控制台中输入:

npm run build

期望的输出结果应该看起来像:

> npm run build

> js@1.0.0 build /home/user/repositories/myproject/js
> webpack -v

4.42.0

-2

npm webpack --version

这对我来说可行,它会抛出类似以下的内容:

PS C:\Users\alfon\OneDrive\Escritorio\sandbox\fimusicv4\with-redux-app> npm webpack --version npm WARN config global --global, --local are deprecated. Use --location=global instead. 8.5.5


2
请注意,此操作忽略webpack参数并打印您的npm版本。 - nurettin
2
npm run webpack --version - Augusto Vasques

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接