SingleFile: A Browser Extension and CLI Tool for Saving Complete Webpages as a Single HTML File

When using a browser’s built‑in “Save page as” feature, images are often lost and many auxiliary files are created; SingleFile, a popular open‑source project on GitHub, solves this problem by saving a complete page into a single HTML file.

Overview : SingleFile is both a browser extension and a CLI tool that quickly converts a fully loaded web page into a single HTML document. It is compatible with Chrome, Firefox (desktop and mobile), Edge, Vivaldi, Brave, Waterfox, Yandex, Opera and other mainstream browsers.

Installation :

Firefox: https://addons.mozilla.org/firefox/addon/single-file

Firefox mobile: https://blog.mozilla.org/addons/2020/09/29/expanded-extension-support-in-firefox-for-android-nightly/

Chrome: https://chrome.google.com/extensions/detail/mpiodijhokgodhhofbcjdecpffjipkle

Microsoft Edge: https://microsoftedge.microsoft.com/addons/detail/efnbkdcfmcmnhlkaijjjmhjjgladedno

Manual zip download: https://github.com/gildas-lormeau/SingleFile/archive/master.zip (follow the manual‑install steps below)

Simple usage : After a page finishes loading, click the SingleFile button in the extension toolbar to save the page; click it again to cancel. The extension’s context menu also allows saving the current tab, selected content, or selected frame, and can process multiple tabs at once (selected, unfixed, or all tabs). Additional options let you annotate, highlight, add or delete content, enable auto‑save, and specify the download folder.

Command‑line interface :

SingleFile can be run from the command line using Node.js as the injection engine.

Docker installation

docker pull capsulecode/singlefile
docker tag capsulecode/singlefile singlefile

Manual installation

git clone --depth 1 --recursive https://github.com/gildas-lormeau/SingleFile.git
cd SingleFile/cli
docker build --no-cache -t singlefile .

Running

docker run singlefile "https://www.wikipedia.org"

To redirect output to a file:

docker run singlefile "https://www.wikipedia.org" > wikipedia.html

Manual (npm) installation

npm install -g "gildas-lormeau/SingleFile#master"

Or download and unzip the source, then install dependencies:

unzip master.zip .
cd SingleFile-master
npm install
cd cli

Or install directly from the git repository:

git clone --depth 1 --recursive https://github.com/gildas-lormeau/SingleFile.git
cd SingleFile
npm install
cd cli

Running the CLI

Syntax:

single-file
[output] [options ...]

Show help:

single-file --help

Examples:

Save a page to a specific file: single-file https://www.wikipedia.org wikipedia.html

Save URLs listed in a file: single-file --urls-file=list-urls.txt

Integration with user scripts : You can run custom scripts before or after the page is saved. Enable the feature by setting userScriptEnabled: true in the extension’s JSON options or by passing --browser-script to the CLI. Example scripts can dispatch custom events such as single-file-user-script-init , listen for single-file-on-before-capture-request to modify the DOM before capture, and listen for single-file-on-after-capture-request to restore changes after capture.

(() => {
  const elements = new Map();
  const removedElementsSelector = "img";
  dispatchEvent(new CustomEvent("single-file-user-script-init"));
  addEventListener("single-file-on-before-capture-request", () => {
    document.querySelectorAll(removedElementsSelector).forEach(element => {
      const placeHolderElement = document.createElement(element.tagName);
      elements.set(placeHolderElement, element);
      element.parentElement.replaceChild(placeHolderElement, element);
    });
  });
  addEventListener("single-file-on-after-capture-request", () => {
    Array.from(elements).forEach(([placeHolderElement, element]) => {
      placeHolderElement.parentElement.replaceChild(element, placeHolderElement);
    });
    elements.clear();
  });
})();