←back to thread

381 points cezaraugustodev | 2 comments | | HN request time: 0.008s | source

Hello HN! I'm the creator and solo developer of Extension.js, a development tool for browser extensions with built-in support for TypeScript, WebAssembly, React, and modern JavaScript. Developers use it to spend less time configuring the compilation config or learning new frameworks and more time actually writing code.

Most projects similar to Extension.js rely on some sort of abstraction or configuration to get started, making the initial development process slow given the extra learning curve and setup guidelines. By using Extension.js, adding the package to your npm scripts is all it takes to get started developing cross-browser extensions with no build configuration. Say goodbye to extensive configurations to create your next cross-browser extension!

Creating a new extension is super easy. This command will create a new extension named "my-extension" in the current working directory. In your terminal:

npx extension@latest create my-extension

You can also create an extension based on any extension hosted on GitHub. Just add the URL of the folder where the manifest is located and run `npx extension@latest dev <github_url>`. For instance, you can try the Chrome Sample "page-redder" (https://github.com/GoogleChrome/chrome-extensions-samples/tr...).

I first created this project as a way to teach others how to develop browser extensions, until I realized that a good amount of my teachings would involve setting up a new project. With Extension.js, the abstractions and configurations needed to create cross-browser extensions are handled by a simple command-line interface, allowing developers to focus on the actual development of their next extension.

Any feedback is appreciated. I've been using it for a while in personal projects but it is now mature enough for others to give it a go. I'm looking forward to hear what you all have to say! :D

Show context
outlore ◴[] No.40213340[source]
this is cool! how would you contrast this with Plasmo, a similar framework?

https://www.plasmo.com/

replies(2): >>40213831 #>>40214742 #
1. cezaraugustodev ◴[] No.40214742[source]
Great question!

The biggest difference, in my opinion, is that Plasmo is a framework, which means you have to learn its abstractions and rely on specific samples tailored for these abstractions to create new extensions. There are config files and specific rules to follow that are not necessarily related to browser extensions.

On the other hand, Extension.js allows developers to create extensions using the standard extension APIs and abstracts only the configuration files, without the need to learn the tooling specifics. This way, a sample from Chrome or MDN that works with a manifest file as the source of truth requires no refactoring to work with Extension.js, making it easier to get started and prototype new projects.

replies(1): >>40218558 #
2. selalipop ◴[] No.40218558[source]
I’ve used Plasmo without touching their framework (essentially using it for HMR and bundling) and it works pretty well

But it’s never a bad thing to have two projects solving a painful problem