This is a boilerplate for a Chrome Extension using Vite, Vue, and tailwindcss, designed for MV3.
- Uses Vite as a build tool ๐ ๏ธ
- Utilizes Vue 3 as a front-end framework ๐ฅ๏ธ
- Includes tailwindcss for easy styling ๐จ
- Supports webextension-polyfill for browser API compatibility ๐
- Includes hot reload for automatic updates during development ๐ฅ
- Includes a build script to package the extension ๐ฆ
- Clone this repository.
- Install dependencies using
npm install
. - Run the development server using
npm run start
. - Load the extension in your browser by following these steps:
- Navigate to chrome://extensions.
- Turn on Developer mode.
- Click on "Load unpacked" and select the "dist" folder.
- Make changes to the code and see them update automatically in the browser.
start
: Runs the development server using Vite with hot reload enabled.build
: Builds the extension using Vite and outputs the result in the "dist" folder.package
: Builds the extension and packages it into a .crx file using the build.js script.test
: Runs the vitest command.lint
: Lints the code using eslint and the @vue/eslint-config-prettier config.prettier
: Formats the code using Prettier.
In the future, we plan to add support for Firefox and Safari browsers. Stay tuned for updates!
This project is licensed under the MIT License. See the LICENSE file for details.