Extension.js
is a monorepo consisting of multiple programs and packages.
- Programs: Each CLI command (including the CLI itself) is a program.
- Packages: Helper libraries and built-in webpack plugins.
Package Name | Description |
---|---|
browser-extension-manifest-fields |
Library to output manifest asset paths. |
common-errors-plugin |
Plugin to handle common compilation errors. |
eslint-config-extension-create |
Preset of eslint rules for Extension.js. |
html-plugin |
Plugin to handle and compile HTML fields (and its assets) from the manifest. |
icons-plugin |
Plugin to handle and compile icon fields from the manifest. |
json-plugin |
Plugin to handle and compile JSON fields from the manifest. |
locales-plugin |
Plugin to handle and compile locales fields from the manifest. |
manifest-compat-plugin |
Plugin to handle compatibility errors in the manifest. |
manifest-plugin |
Plugin to handle and compile the manifest file. |
resolve-plugin |
Plugin to resolve paths for Chrome or browser API namespaces. |
resources-plugin |
Plugin to handle and compile static across the extension features. |
run-chrome-extension |
Plugin to run the Chrome browser during development. |
run-edge-extension |
Plugin to run the Edge browser during development. |
run-firefox-extension |
Plugin to run the Firefox browser during development. |
scripts-plugin |
Plugin to handle and compile script fields from the manifest. |
tsconfig |
The shared tsconfig to handle the project TypeScript files during compilation. |
Extension.js includes several command line programs, each serving a specific purpose in the extension development lifecycle:
Program | Description |
---|---|
cli |
The Command Line Interface that executes the Extension.js programs. |
create |
Create extensions from built-in templates. |
develop |
Wrapper around the webpack config that consists of the dev , start , and build commands. |
publish |
This is empty for now. |
- Clone the project
[email protected]:cezaraugusto/extension.git
&&cd extension
. - Install dependencies (will symlink files where appropriate)
yarn install
- Create an
.env
file at the project root and addEXTENSION_ENV=development
To watch and apply changes to the project, you will need two or more terminals open:
yarn watch
NOTE: The browser runners (
run-chrome-extension
andrun-edge-extension
) are not watched by default, since they trigger the execution of the browser binary. To see changes applied to these packages, apply ayarn compile
command either globally (at project root) or individually (runningyarn compile
at the package folder level).
The CLI is available internally as an npm script yarn extension <command> [argument]
.
Use it to experiment with the multiple Extension.js CLI commands.
yarn extension <command> [argument]
The monorepo's package.json
includes scripts that affect all programs and packages at once
and are needed for the project development.
This is the same command users run when they do `npx extension
yarn extension <command> [args] [flags]
Compiles (builds) packages and programns. This npm script generates the /dist
folder that other packages may consume.
yarn compile
Like compile, but listens for code changes, where it compiles again.
Note: You want a terminal always running this command during development.
yarn watch
Iterates over all projects and lint them using ESLint.
yarn lint
Run the test suite of each package and program (where available).
yarn test
Deletes cache, dist/ and node_modules/ across packages and programs .
yarn clean