Overview

A browser extension to facilitate day-to-day tasks. Works on both chrome-based and firefox browsers

Usage

npm install -g pnpm
pnpm install

for development,

pnpm dev

To build the extension, run

pnpm build # to build directory for the set browser `TARGET_BROWSER` (chrome, firefox)
pnpm build:chrome # to build chrome directory (`dist/chrome`)
pnpm build:firefox # to build firefox directory (`dist/firefox`)
pnpm build:all # to build both chrome and firefox

Then load extension to the browser(chrome), chrome://extensions as an unpacked extension directing to the path dist/chrome, generated after pnpm build:chrome

Similarly, load the temporary add-on at about:debugging, directing to the path dist/firefox, generated after pnpm build:firefox

Project Structure

• src - main source.
  • content-scripts - scripts and components to be injected as content_scripts"
  • background - scripts to run as service worker
  • popup - popup vue application
  • options
  • views - application pages, common to all views (Help, Authentication etc.,)
• dist/chrome - built files

References

• Chrome API
• FireFox
• Vite
• Vite Config
• CRXJS Vite Plugin
• TypeScript
• nodejs-polars
• ag-grid-vue3
• Plotly
• lightweight-charts
• Axios
• webext-bridge
• vite-plugin-pages
• Tailwind
• daisyUI
• Pinia
• VueUse
• Marked
• <script setup> SFC syntax
• setup SFC syntax
• VueChartJS