Skip to content

NirlStudio/hooks-webpack-plugin

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

8 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

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.

Bugs & Pull Requests

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

License

This project is licensed under the MIT license.

About

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

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published