damoclark / parcel-optimizer-userscript

Parcel plugin that automatically adds a userscript metadata header to the final bundled .user.js file

parcel-optimizer-userscript

Overview

Parcel plugin for userscript development - adds the metadata header to your .user.js file.

Installation

npm install -D parcel @damoclark/parcel-optimizer-userscript

In your package.json:

{
  "name": "Userscript Name",
  "version": "1.0.0",
  "description": "",
  "main": "dist/userscript.user.js",
  "source": "src/userscript.user.mjs",
  "scripts": {
    "watch": "npx parcel watch",
    "build": "npx parcel build src/userscript.user.mjs"
  },
  "devDependencies": {
    "@damoclark/parcel-optimizer-userscript": "^0.0.1",
    "parcel": "^2.7.0"
  }
}

Then add the following config files:

.parcelrc

{
  "extends": "@parcel/config-default",
  "optimizers": {
    "*.user.{mjs,js,ts}": ["...", "@damoclark/parcel-optimizer-userscript"]
  }
}

Where *.user.{mjs,js,ts} matches the filename for your main userscript file in your package.json.

.userscriptrc

{
  "userscriptMeta": "path/to/userscript.meta.js"
}

and userscriptMeta points to the file containing the metadata header for your userscript

Example for userscript.meta.js

// ==UserScript==
// @name        Userscript Name
// @namespace   https://userscript.com
// @description Description
// @include     https:/*
// @version     0.0.1
// @noframes
// @grant       none
// ==/UserScript==

Usage

While developing:

npx parcel watch --no-hmr

To produce final build:

npx parcel build src/userscript.user.mjs

Licence

MIT

Acknowledgements / Attribution

Original source code written by AKP Tools (https://github.com/akp-tools).