crx3-dev-template icon indicating copy to clipboard operation
crx3-dev-template copied to clipboard

你好,请问,我想在content_scripts中写vue的ui界面。应该如何去写。

Open geeklibin opened this issue 2 years ago • 0 comments

manifest.json

"content_scripts": [
        {
            "matches": ["<all_urls>"],
            "js": ["./libs/content/panel.js"],
            "run_at": "document_idle"
        }
    ]

./libs/content/panel.js

import {createApp} from 'vue'
import App from './App.vue'


let id = '1688-detail-tools-container'
let container = document.getElementById(id)
if(container) container.innerHTML = ''
container = document.createElement('div')
container.setAttribute('id', id)
document.body.appendChild(container)



const app = createApp(App)
app.mount(container)

App.vue

<template>
<div>Hello inject</div>
</template>

先前我是用vite-plugin-chrome-extension的时候是采用这种写法。但是在使用crx3会报错: image

geeklibin avatar Jul 29 '22 12:07 geeklibin