@gb-nx/browser

This library was generated with Nx.

Nx Plugin adding first class support for Manifest V3 Browser Extension applications in your Nx workspace

Features

Here is a list of some of the coolest features of the plugin:

• ✅ Generation of browser extensions applications
• ✅ Building, testing, etc your extension projects
• ✅ Packaging your extension projects for web stores

Prerequisite

If you have not already, create an Nx workspace with the following:

# npm
npx create-nx-workspace@latest

# yarn
yarn create nx-workspace@latest

Getting Started

Then you need to install the plugin in order to generate browser applications later on.

Installing Plugin

npx nx add @gb-nx/browser

Generating Project

Simply run the extension generator with the following command:

nx generate @gb-nx/browser:extension --name=my-extension --directory=apps/my-extension --projectNameAndRootFormat=as-provided

Working with your Project

nx run my-extension:build

Load (or reload) the unpacked extension from dist/apps/my-extension with Manage Extensions in your browser.

Refresh a browser page

Observe changes

Make changes to my-extension\src

Repeat

Packaging your Project for Store Distribution

Run the zip target to create a versioned archive of your extension.

nx run my-extension:build:production nx zip my-extension --tagGit false

Migrations

This plugin supports Nx migrations and provides necessary version and code updates. So instead of bumping plugin version manually in package.json it's recommended to run nx migrate @gb-nx/browser command, that includes bumping the version of the @gb-nx/browser plugin, related dependencies and running code migrations.

@gb-nx/browser & Nx Compatibility Chart

| @gb-nx/browser version | Nx version | | ---------------------- | ---------- | | ^8.0.0 | >=17.0.0 | | ^6.0.0 | ^17.0.0 | | ^5.0.0 | ^16.0.0 | | <5.0.0 | ^15.0.0 |

Useful resources

• Developer Dashboard
• Chrome Web Store - Chrome Developers
• Chrome Web Store - Extensions
• Resize a PNG - Online PNG Maker

License

MIT