最近，我正在使用vuejs开发chrome扩展程序，并且具有与将整个Vue应用程序注入特定网页(即google.com)相同的要求，但遗憾的是vue-路由器不起作用.

Recently I was developing chrome extension with vuejs and has the same requirement that need to inject whole Vue app to specific web page i.e. google.com, but sadly vue-router doesn't work.

我使用了此样板，以最少的更改即可轻松工作.

I used this boilerplate to get it working easily with least changes.

使用此样板创建Vue项目后，您需要更新src/popup/popup.js才能在网页中注入vue应用.

Once you created Vue project with this boilerplate then you need to update src/popup/popup.js to inject vue app in web page.

...
const div = document.createElement("div")
document.body.insertBefore(div, document.body.firstChild);

new Vue({
   el: div,
   render: h => { return h(App); }
});

将vue应用作为内容脚本添加到manifest.json中，而不是使用browser_action或page_action.

Add vue app as content scripts in manifest.json instead of browser_action or page_action.

"content_scripts": [{
    "matches": ["*://*.google.com/*"],
    "js": [
        "popup/popup.js"
    ],
    "css": ["/popup/popup.css"]
}]

vue应用将仅在google.com上注入.如果要插入所有网页，则从content_scripts中删除匹配项

Here vue app will be injected on google.com only. If you want to inject in all web pages then remove matches from content_scripts

PS

被管理为以抽象模式工作的vue路由器，并在 new Vue({...，router})之后调用 router.replace("/")

Managed to vue router working with mode abstract and call router.replace("/") after new Vue({ ..., router })