【问题标题】:How to determine the installed webpack version如何确定已安装的 webpack 版本
【发布时间】:2017-05-30 09:44:21
【问题描述】:

特别是在从 webpack v1 到 v2 的过渡期间,以编程方式确定安装了哪个 webpack 版本非常重要,但我似乎找不到合适的 API。

【问题讨论】:

    标签: javascript node.js webpack webpack-2 webpack-3


    【解决方案1】:

    安装的版本:

    使用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 命令:

    yarn list webpack
    

    如何以编程方式进行?

    Webpack 2 引入了Configuration Types

    您可以返回一个函数,而不是导出配置对象 它接受一个环境作为参数。运行 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 [&lt;@scope&gt;/]&lt;name&gt;[@&lt;version&gt;] [&lt;field&gt;[.&lt;subfield&gt;]...]


    对于 webpack 使用:

    npm view webpack version
    

    【讨论】:

    • 所以 webpack 没有返回其版本的 API,我必须使用 shell 命令?
    • 这可以通过 cli 正常工作....但是如何以编程方式执行此操作? (又名:在脚本文件中)
    • 我已经包含了一种以编程方式提取 webpack 版本并将其用作任何文件中的全局常量的方法。
    • 好吧,我必须输入npx webpack --version
    • @doberkofler 有(现在正确的)答案,它甚至被标记为正确答案! stackoverflow.com/a/52143627/3221576 您不能依赖 webpack -v,因为这假定您当前的 shell 的 webpack 与您程序中运行的相同。
    【解决方案2】:

    对于那些正在使用yarn的人

    yarn list webpack 可以解决问题

    $ yarn list webpack
    yarn list v0.27.5
    └─ webpack@2.6.1
    Done in 1.24s.
    

    【讨论】:

      【解决方案3】:

      只是另一种尚未提及的方式:

      如果您将其安装到本地项目中,则打开 node_modules 文件夹并检查您的 webpack 模块。

      $cd /node_modules/webpack/package.json

      打开package.json文件,查看版本

      【讨论】:

      • 我确定你可以cd 成文件
      【解决方案4】:

      webpack 4 现在提供了一个可以使用的版本属性!

      【讨论】:

      • 这意味着无论您在哪里提供了webpack 变量(就像在您的设置/配置文件中一样),您都可以调用webpack.version,您将得到一个版本字符串形式"x.y.z".
      【解决方案5】:

      如果使用 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
      

      【讨论】:

      • 在 Angular 10 中,webpack 没有以ng version 列出。如果你使用 @angular-builders/custom-webpack 的自定义 webpack 配置,试试 npm list webpack,它显示了 webpack 的使用版本。
      【解决方案6】:

      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
      

      【讨论】:

        【解决方案7】:

        在 CLI 中

        $ webpack --version
            
        webpack-cli 4.1.0
            
        webpack 5.3.2
        

        在代码中(节点运行时)

        process.env.npm_package_devDependencies_webpack // ^5.3.2
        

        process.env.npm_package_dependencies_webpack // ^5.3.2
        

        在插件中

        compiler.webpack.version // 5.3.2
        

        【讨论】:

          猜你喜欢
          • 2011-02-12
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 2010-09-13
          • 2010-09-30
          • 2014-11-09
          相关资源
          最近更新 更多