使用CRXjs、Vite、Vue 开发 Chrome 多页面插件,手动配置 vite.config.ts 和 manifest.json 文件
// vite.config.ts
import { defineConfig } from 'vite';
import crx from 'vite-plugin-chrome';
export default defineConfig({
plugins: [
crx({
manifest: {
version: '1.0.0',
description: 'Chrome extension for my CRXjs + Vite + Vue project',
permissions: ['tabs', 'storage'],
background: {
service_worker: 'background.js',
},
action: {
default_popup: 'index.html',
default_title: 'My Extension',
},
},
// 如果有多个页面,可以在这里添加更多的入口
entries: ['background.js', 'popup.html'],
}),
],
build: {
target: 'es2015', // 确保与 Chrome 支持的 ES 版本一致
// 其他配置...
},
});
请注意,这个配置假设你有一个 background.js
和一个 popup.html
文件作为入口点。如果你有其他页面,你需要在 entries
数组中添加相应的文件名。此外,请确保 vite-plugin-chrome
插件与你的 vite
版本兼容。
评论已关闭