sal-modular/extension/vite.config.js

121 lines
3.9 KiB
JavaScript

import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
import wasm from 'vite-plugin-wasm';
import topLevelAwait from 'vite-plugin-top-level-await';
import { resolve } from 'path';
import fs from 'fs';
import { Plugin } from 'vite';
// Custom plugin to copy extension files directly to the dist directory
const copyExtensionFiles = () => {
return {
name: 'copy-extension-files',
closeBundle() {
// Create the wasm directory in dist if it doesn't exist
const wasmDistDir = resolve(__dirname, 'dist/wasm');
if (!fs.existsSync(wasmDistDir)) {
fs.mkdirSync(wasmDistDir, { recursive: true });
}
// Copy the wasm.js file
const wasmJsSource = resolve(__dirname, 'wasm/wasm_app.js');
const wasmJsDest = resolve(wasmDistDir, 'wasm_app.js');
fs.copyFileSync(wasmJsSource, wasmJsDest);
// Copy the wasm binary file
const wasmBinSource = resolve(__dirname, 'wasm/wasm_app_bg.wasm');
const wasmBinDest = resolve(wasmDistDir, 'wasm_app_bg.wasm');
fs.copyFileSync(wasmBinSource, wasmBinDest);
// Create background directory and copy the background script
const bgDistDir = resolve(__dirname, 'dist/background');
if (!fs.existsSync(bgDistDir)) {
fs.mkdirSync(bgDistDir, { recursive: true });
}
const bgSource = resolve(__dirname, 'background/index.js');
const bgDest = resolve(bgDistDir, 'index.js');
fs.copyFileSync(bgSource, bgDest);
// Create popup directory and copy the popup files
const popupDistDir = resolve(__dirname, 'dist/popup');
if (!fs.existsSync(popupDistDir)) {
fs.mkdirSync(popupDistDir, { recursive: true });
}
// Copy HTML file
const htmlSource = resolve(__dirname, 'popup/index.html');
const htmlDest = resolve(popupDistDir, 'index.html');
fs.copyFileSync(htmlSource, htmlDest);
// Copy JS file
const jsSource = resolve(__dirname, 'popup/popup.js');
const jsDest = resolve(popupDistDir, 'popup.js');
fs.copyFileSync(jsSource, jsDest);
// Copy CSS file
const cssSource = resolve(__dirname, 'popup/popup.css');
const cssDest = resolve(popupDistDir, 'popup.css');
fs.copyFileSync(cssSource, cssDest);
// Also copy the manifest.json file
const manifestSource = resolve(__dirname, 'manifest.json');
const manifestDest = resolve(__dirname, 'dist/manifest.json');
fs.copyFileSync(manifestSource, manifestDest);
// Copy assets directory
const assetsDistDir = resolve(__dirname, 'dist/assets');
if (!fs.existsSync(assetsDistDir)) {
fs.mkdirSync(assetsDistDir, { recursive: true });
}
// Copy icon files
const iconSizes = [16, 32, 48, 128];
iconSizes.forEach(size => {
const iconSource = resolve(__dirname, `assets/icon-${size}.png`);
const iconDest = resolve(assetsDistDir, `icon-${size}.png`);
if (fs.existsSync(iconSource)) {
fs.copyFileSync(iconSource, iconDest);
}
});
console.log('Extension files copied to dist directory');
}
};
};
export default defineConfig({
plugins: [
react(),
wasm(),
topLevelAwait(),
copyExtensionFiles()
],
build: {
outDir: 'dist',
emptyOutDir: true,
// Simplify the build output for browser extension
rollupOptions: {
input: {
popup: resolve(__dirname, 'popup/index.html')
},
output: {
// Use a simpler output format without hash values
entryFileNames: 'assets/[name].js',
chunkFileNames: 'assets/[name]-[hash].js',
assetFileNames: 'assets/[name].[ext]',
// Make sure output is compatible with browser extensions
format: 'iife',
// Don't generate separate code-split chunks
manualChunks: undefined
}
}
},
// Provide a simple dev server config
server: {
fs: {
allow: ['../']
}
}
});