Chrome Extension で Vue.js を使いたい

Chrome Extension は Content Security Policy (CSP) に準拠した JavaScript しか動かせない。
Vue の eval が unsafe だとかで警告が出る（たぶん vue.min.js だと警告すら出ないので原因に気づきづらい）。

対策

対象の html を SandBox として指定する

"sandbox":{
    "pages": [
        "main.html"
    ]
}

• ただしここで指定した html では Chrome Extension の API が使用できない。 API を使用する必要がある場合は別ページにメッセージで値を渡したりする必要がある。

CSP 準拠ビルドの Vue を使用する

• https://github.com/vuejs/vue/tree/csp/dist
• npm だったら npm install npm@csp でいける

参考

• CSP環境でVue.jsを使う
• ChromeAppsのSandBox化について
• Instllation -- CSP-environments
• Vue.js in Chrome extension