Package Exports

webpack-browser-extension-scripts
webpack-browser-extension-scripts/dist/module.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (webpack-browser-extension-scripts) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

webpack-browser-extension-scripts

webpack plugin to handle manifest script assets (content_scripts, background.scripts, service_worker, user_scripts) from browser extensions

Properly output script files based on the manifest fields declared in the manifest file.

Supports

Background scripts: refers to background.scripts
Content scripts: refers to content_scripts
Service Worker script (V3): refers to background.service_worker
User scripts: refers to user_scripts

Install

npm i webpack-browser-extension-scripts --save-dev

Usage

Check the demo folder for a list of samples using a HMR plugin.

// webpack.config.js

const ScriptsPlugin = require('webpack-browser-extension-scripts')

module.exports = {
  // ...other webpack config,
  plugins: [
    new ScriptsPlugin({
      manifestPath: '<path-to-my-manifest-json-file>',
      exclude: ['<path_to_excluded_folder>']
    })
  ]
}

What this plugin do?

Given a manifest file, grab all possible JavaScript fields and add them as webpack entry points.

// myproject/manifest.json
{
  "manifest_version": 2,
  "version": "0.1",
  "name": "myextension",
  "author": "Cezar Augusto",
  "background": {
    "scripts": ["background1.js", "background2.js"]
  }
}

// myproject/webpack.config.js
const path = require('path')
const ScriptsPlugin = require('webpack-browser-extension-scripts').default

const manifestPath = path.join(__dirname, 'manifest.json')
const outputPath = path.resolve(__dirname, './dist')

module.exports = {
  mode: 'development',
  entry: {},
  output: {
    path: outputPath,
    clean: true
  },
  plugins: [
    new ScriptsPlugin({
      manifestPath
    })
  ]
}

Output:

- myproject/
  - background/index.js

License

MIT (c) Cezar Augusto.