Developer Tooling for Extension Development
Hi,
I am new to extension development and have a couple of ideas to build but I can't find how to do my tooling. I tried to find some cool articles, guides, etc. but not much stuff out there.
I am normally a React dev who is using Gatsby for his stuff. I have already covered the basics of extension-making but doing all those stuff without tooling on VSCode is pain.
Are there any useful guides for tooling, linting, prettify, and maybe hot reloading, etc. for extension development?
What are your productivity hacks and fav workflows of creating extensions?
Trending on Indie Hackers
Hey, yeah its a bit tough to get started, but there are some good resources out there. This: https://github.com/GoogleChrome/chrome-extensions-samples is an older, manifest 2 based Chrome examples repository.
Another good starting point is this: https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Your_first_WebExtension -- its Mozillas take on getting started with addons.
Stack: TypeScript, Svelte.
Packaging: Rollup. There's a very useful plugin https://github.com/extend-chrome/rollup-plugin-chrome-extension that makes this much easier.
I use the async "browser" API (on Chrome I use the browser polyfill https://github.com/Lusito/webextension-polyfill-ts).
I actually built https://chromeextensionkit.com/ a little while back for exactly this reason. There was a ton of hurdles when I initially jumped into the extension development space so I decided to build a series of templates and scripts to make it easier for other devs wanting to do the same. I also write occasional blog posts on the site for various extension topics (if there are topics you'd like to see, let me know!).
Not sure if that's what you're looking for, but I figured I would mention it either way.
Firstly, congrats on your successful launch, and I am sure it's an amazing starter kit but I am looking for some guides, etc. to do it by myself :)
It's surprising that there is literally no info about v3 and how to do a proper development.
Likewise, I didn't find much either. Ended up writing my own bash script to package it for different environments, including production. All it does is does replace the test URLs with a different URL, and copy over the relevant asset folders.
But reloading extensions in the browser is pretty much done manually.
Yeah, i don't know much about bash scripting :) All I wanted was kicking a quick setup and do some weekend project. It seems I will go yolo.