I’m currently building a Chrome Extension with a vuejs powered frontend. This worked pretty great using
vuecli. Up until the point at which the app started using the
Webextension-API. Normal websites do not have access to this API; registered Extensions do.
So what’s a good setup for developing a
vuejs-Extension with the power of using
vuecli (which supports webpack tooling)? What setup allows to test the application?
I recommend using
vue-cli-plugin-browser-extension. Note that while the README indicates Vue CLI 3.x support, it also works with Vue CLI 4.x (tested with 4.3.1).
It supports several features that will save you a bunch of time, including live-reload, and bundling for Chrome and Firefox (and other browsers).
To install it in a Vue CLI project, just run:
vue add browser-extension.