https://github.com/pb-yuri-zaporozhets/vue-chrome-extension-template

vue chrome extension template
https://github.com/pb-yuri-zaporozhets/vue-chrome-extension-template

chrome-extension hot-reloading vue wcer

Last synced: 6 days ago
JSON representation

vue chrome extension template

• Host: GitHub
• URL: https://github.com/pb-yuri-zaporozhets/vue-chrome-extension-template
• Owner: pb-yuri-zaporozhets
• License: mit
• Created: 2017-11-02T02:13:18.000Z (about 7 years ago)
• Default Branch: master
• Last Pushed: 2020-03-13T20:54:34.000Z (almost 5 years ago)
• Last Synced: 2024-12-06T17:15:14.970Z (about 1 month ago)
• Topics: chrome-extension, hot-reloading, vue, wcer
• Language: JavaScript
• Size: 323 KB
• Stars: 653
• Watchers: 16
• Forks: 103
• Open Issues: 25
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Vue.js Chrome Extension Template ([wcer](https://github.com/YuraDev/wcer))

> Template for quick creation of Chrome extension on Vuejs c hot reloading when developing.

![Vue.js Chrome Extension Template images](/docs/images/mini.jpg)

## Installation:

This boilerplate was built as a template for [vue-cli](https://github.com/vuejs/vue-cli) and includes options to customize your final scaffolded app. 

``` bash

# install vue-cli

$ npm install -g vue-cli

# create a new project using the template

$ vue init YuraDev/vue-chrome-extension-template my-project

# install dependencies and go!

$ cd my-project

$ npm install # or yarn

$ npm run dev # or yarn dev

```

## Structure

* [backend](https://developer.chrome.com/extensions/background_pages): Background work of your scripts

* [content](https://developer.chrome.com/extensions/content_scripts) Run in the context of web pages 

* [devtools](https://developer.chrome.com/extensions/devtools) - It can add new UI panels and sidebars, interact with the inspected page, get information about network requests, and more.

* [options](https://developer.chrome.com/extensions/options) - To allow users to customize the behavior of your extension, you may wish to provide an options page.

* popup - The page (window) that will be displayed when the icon is clicked

* tab - Your application will work in a separate tab

* ext - Shared scripts

* [manifest.js](https://developer.chrome.com/extensions/manifest) - Descriptions of the application, its rights and possibilities