webpack-tampermonkey v2.0.0
webpack-tampermonkey
A Webpack4+ plugin for userscript projects.
It was a project prototype before v1.*, but it shows no flexibility and not customizable until it is a webpack plugin. For example, it did not support multiple scripts in a single project in v1.*. See issue #1.
Features
- Make your userscript development combined with Webpack
With powerful Webpack support, you can even package everything in your userscript, e.g. icons and json data.
- Ability to generate userscript headers
- Ability to generate both
.user.js
and.meta.js
.meta.js
is used for update check containing headers only. - Properly track files in watch mode
Including external header files and package.json.
Installation
npm i webpack-tampermonkey -D
Usage
webpack.config.js
Include the plugin in the webpack.config.js
as the following example.
const WebpackTampermonkey = require('webpack-tampermonkey')
module.exports = {
plugins: [
new WebpackTampermonkey()
]
}
Examples
Examples can be found under the test fixture folder.
Configuration
WebpackTampermonkey
The WebpackTampermonkey
constructor has the following signature.
new WebpackTampermonkey(options)
options
Also see the schema of options.
type WebpackTampermonkeyOptions =
WPTMOptions |
HeaderFile | // shorthand for WPTMOptions.headers
HeaderProvider // shorthand for WPTMOptions.headers
WPTMOptions
interface WPTMOptions {
headers: HeaderFile | HeaderProvider
/**
* Output *.meta.js or not
*/
metajs: boolean
/**
* Rename all .js files to .user.js files.
*/
renameExt: boolean
/**
* Prettify the header
*/
pretty: boolean
}
HeaderFile
A path to a js or json file which exports a header object.
type HeaderFile = string
HeaderProvider
A function that returns a header object.
type HeaderProvider = (data: object) => HeaderObject
Note that data
contains the same variables as output.filename
templates.
HeaderObject
A header object.
Also see explicit-config/webpack.config.js.
type HeaderFile = object