Project setup

To start building your Chrome printing extension, you’ll first need to create an empty Chrome extension—a framework that will house your customized HTML, JS, and JSON.

Your printing extension will live in a single file folder. For the purposes of this tutorial, we’ll name this folder print-ext. For now, this folder will contain four empty files: manifest.json, background.js, printers.html, and printers.js.

Once complete, your file structure will look like this:

print-ext

|__manifest.json

|__background.js

|__printers.html

|__printers.js

Copy the following code to your manifest.json to create just the basic foundation of a Chrome extension:

{
    "name": "Chrome Extension",
    "version": "1.0",
    "manifest_version": 3,
    "description": "A basic Chrome Extension.",
    "permissions": ["printing"],
    "background": {
        "service_worker": "background.js"
    },
    "action": {}
}