VueTex - Webextension Starter

A Vite, Vue 3 and Vuetify 3 powered WebExtension (Chrome starter template.

Features

• ⚡️ No nonsense, simple plug and play
• 🥝 Vue 3 - Composition API, <script setup> syntax and more!
• 🦾 TypeScript - type safe
• 🖥 Content Script - Use Vue even in content script
• 🌍 WebExtension - isomorphic extension for Chrome, Firefox, and others

Pre-packed

WebExtension Libraries

• webextension-polyfill - WebExtension browser API Polyfill with types

Use the Template

Simple clone this repo and run npm install

Usage

Folders

• src - main source.
  • assets - assets used in Vue components
  • background - scripts for background.
  • components - auto-imported Vue components that are shared in popup and options page.
  • contentScript - scripts and components to be injected as content_script
  • options - the vue template for the options page
  • plugins - vuetify etc
  • popup - the vue template for the popup
• extension - extension package root.
  • dist - built files

Build

To build the extension, run

npm build

And then pack files under extension

Credits

As you might tell from this ReadMe and a lot of the code in this repo, this template was inspired by the excellent vitesse-webext by antfu. I would've used that but I hate tailwind and I wanted something much more simple and straightforward