vue.js 浏览器插件

// manifest.json
{
  "manifest_version": 2,
  "name": "Vue.js Button Plugin",
  "version": "1.0",
  "permissions": [
    "activeTab"
  ],
  "content_scripts": [
    {
      "matches": ["<all_urls>"],
      "js": ["content.js"]
    }
  ]
}

// content.js
document.addEventListener('DOMContentLoaded', function() {
  const button = document.createElement('button');
  button.textContent = 'Click Me';
  button.style.position = 'fixed';
  button.style.bottom = '10px';
  button.style.right = '10px';
  document.body.appendChild(button);

  new Vue({
    el: '#app',
    data: {
      message: 'Hello, Vue!'
    },
    methods: {
      showMessage() {
        alert(this.message);
      }
    }
  });

  button.addEventListener('click', () => {
    new Vue({
      el: '#app',
      data: {
        message: 'Hello, Vue!'
      },
      methods: {
        showMessage() {
          alert(this.message);
        }
      }
    }).showMessage();
  });
});