NpmInstallWebpackPlugin

Speed up development by automatically installing & saving dependencies with Webpack.

It is inefficient to Ctrl-C your build script & server just to install a dependency you didn’t know you needed until now.

Instead, use require or import how you normally would and npm install will happen automatically to install & save missing dependencies while you work!

安装

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

用法

webpack.config.js 中:

  1. plugins: [
  2. new NpmInstallPlugin()
  3. ],

相当于

  1. plugins: [
  2. new NpmInstallPlugin({
  3. // 使用 --save 或者 --save-dev
  4. dev: false,
  5. // 安装缺少的 peerDependencies
  6. peerDependencies: true,
  7. // 减少控制台日志记录的数量
  8. quiet: false,
  9. // npm command used inside company, yarn is not supported yet
  10. npm: 'tnpm'
  11. });
  12. ],

可以提供一个 Function 来动态设置 dev

  1. plugins: [
  2. new NpmInstallPlugin({
  3. dev: function(module, path) {
  4. return [
  5. "babel-preset-react-hmre",
  6. "webpack-dev-middleware",
  7. "webpack-hot-middleware",
  8. ].indexOf(module) !== -1;
  9. },
  10. }),
  11. ],

Demo

npm-install-webpack-plugin demo

Features

  • Works with both Webpack ^v1.12.0 and ^2.1.0-beta.0.
  • Auto-installs .babelrc plugins & presets.
  • Supports both ES5 & ES6 Modules. (e.g. require, import)
  • Supports Namespaced packages. (e.g. @cycle/dom)
  • Supports Dot-delimited packages. (e.g. lodash.capitalize)
  • Supports CSS imports. (e.g. @import "~bootstrap")
  • Supports Webpack loaders. (e.g. babel-loader, file-loader, etc.)
  • Supports inline Webpack loaders. (e.g. require("bundle?lazy!./App")
  • Auto-installs missing peerDependencies. (e.g. @cycle/core will automatically install rx@*)
  • Supports Webpack’s resolve.alias & resolve.root configuration. (e.g. require("react") can alias to react-lite)

Maintainers

NpmInstallWebpackPlugin - 图2


Eric Clemmons

NpmInstallWebpackPlugin - 图3


Jonny Buchanan