New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More
Socket
Sign inDemoInstall
Socket

hooks-webpack-plugin

Package Overview
Dependencies
Maintainers
1
Versions
3
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

hooks-webpack-plugin

A bridge plugin which helps to directly attach an action to any compiler or compilation hook in webpack.config.js.

1.0.3
latest
Source
npm
Version published
Weekly downloads
2
-50%
Maintainers
1
Weekly downloads
 
Created
Source

Hooks (Mapping) Webpack Plugin

Tapable hooks is flexible to work as a callback pattern. But unfortunately, when we want to quickly attach a simple action to a compiler or compilation hook, especially directly in webpack.config.js, it's not so convenient. The solution of this plugin is provide a compact naming convention to map both compiler and compilation hooks in a flat options object, for example:

const options = {
  // a sync compiler hook
  beforeRun: (compiler) => {
    // ...
  },
  // An ending '@' is indicating a call to tapAsync
  'done@': (compiler, callback) => {
    // ...
    callback() // notify webpack the action is completed now.
  },
  // A leading '$' is indicating this is a compilation hook.
  $succeedModule: (module) => {
    // ...
  },
  // An ending '?' indicating a call to tapPromise.
  '$additionalAssets?': () => new Promise((resolve, reject) => {
    doSomeAwesomeWork()
      .then((result) => {
        // ...
        resolve(result)
      })
      .catch((err) => {
        // ...
        reject(err)
      })
  })),
  // or use the async/await version
  '$optimizeAssets?': async () => {
    try {
      var result = await doSomeAwesomeWork()
      // ...
      return result
    } catch(err) {
      // ...
      throw err
    }
  })
}

compatibility: This plugin only supports the hooks operations. So it does not work with (very) old versions of webpack.

Installation

npm i -D hooks-webpack-plugin

Example Code

You can put it in webpack.config.js, or anywhere you prefer.

const HooksPlugin = require('hooks-webpack-plugin')

const doSomeAwesomeWork = new HooksPlugin({
  beforeRun: (compiler) => {
    console.log('---- beforeRun ----')
  },
  'done@': (compiler, callback) => {
    console.log('---- packing is done! ----')
    callback()
  },
})

const config = {
  // ...
  plugins: [
    doSomeAwesomeWork,
    // ...
  ],
  // ...
}

Available Hooks

Please refer to webpack's documentation.

Compiler Hooks

Compilation Hooks

Bugs & Pull Requests

You are welcome to report bugs, give suggestions and contributions. Cheers.

License

This project is licensed under the MIT license.

Keywords

webpack

FAQs

Package last updated on 10 Mar 2019

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts