每次只为了安装一个你之前不知道现在才需要的依赖项，就Ctrl-C停止你的构建脚本和服务器，效率太低了。

相反，像往常一样使用 require 或 import，在您工作时，缺少依赖项就会自动安装并保存！

$ npm install --save-dev install-webpack-plugin

用法

在您的 webpack.config.js 中

plugins: [
  new InstallPlugin()
],

这等同于:

plugins: [
  new InstallPlugin({
    dependencies: {
      peer: true,
    },
    packageManager: {
      type: this.getDefaultPackageManager(),
      options: {
        dev: false,
        quiet: false,
      },
    },
    prompt: true,
  });
],

选项

dependencies

类型： Object

与依赖项相关的选项。

peer

类型： Boolean

默认值： true

安装缺失的对等依赖项。

plugins: [
  new InstallPlugin({
    dependencies: {
      peer: true,
    }
  }),
],

packageManager

类型： 'npm' | 'yarn' | 'pnpm' | Object | Function

用于安装依赖项的包管理器。

plugins: [
  new InstallPlugin({
      packageManager: 'yarn'
    },
  }),
],

您可以为 packageManager 提供一个 Function 使其动态化

plugins: [
  new InstallPlugin({
    packageManager: function(module, path) {
      return [
        "babel-preset-react-hmre",
        "webpack-dev-middleware",
        "webpack-hot-middleware",
      ].indexOf(module) !== -1;
    },
  }),
],

type

类型： 'npm' | 'yarn' | 'pnpm'

用于安装依赖项的包管理器的名称。

options

类型： Object

与包管理器相关的选项。

arguments

类型： Array

提供与包管理器一起使用的自定义参数。

plugins: [
  new InstallPlugin({
      packageManager: {
        type: 'npm',
        options: {
          arguments: ['--ignore-scripts']
        }
      }
    },
  }),
],

dev

类型： Boolean

默认值： false

作为开发依赖项安装。

plugins: [
  new InstallPlugin({
      packageManager: {
        type: 'npm',
        options: {
          dev: true,
        }
      }
    },
  }),
],

quiet

类型： Boolean

默认值： false

减少控制台日志输出量。

plugins: [
  new InstallPlugin({
      packageManager: {
        type: 'npm',
        options: {
          quiet: true,
        }
      }
    },
  }),
],

prompt

类型： Boolean

默认值： true

显示提示以确认安装。

plugins: [
  new InstallPlugin({
      prompt: true,
    },
  }),
],

演示

特性

• 适用于 webpack ^v5.0.0。
• 自动安装 .babelrc 插件和预设。
• 支持 ES5 和 ES6 模块。（例如 require, import）
• 支持命名空间包。（例如 @cycle/dom）
• 支持点分隔包。（例如 lodash.capitalize）
• 支持 CSS 导入。（例如 @import "~bootstrap"）
• 支持 webpack 加载器。（例如 babel-loader, file-loader 等）
• 支持内联 webpack 加载器。（例如 require("bundle?lazy!./App"）
• 自动安装缺失的 peerDependencies。（例如 @cycle/core 将自动安装 rx@*）
• 支持 webpack 的 resolve.alias 和 resolve.root 配置。（例如 require("react") 可以别名为 react-lite）

贡献

如果你尚未阅读，请花一点时间阅读我们的贡献指南。

贡献