32ed0b45f0
- Implemented Rulers component for zoom/pan-aware rulers on canvas. - Created Stage component to serve as a zoomable and pannable viewport for the device frame. - Developed Toolbar component for responsive controls, including device presets and zoom functionalities. - Introduced useFrame composable to manage iframe interactions and inspections. - Established a reactive store to manage application state, including guides and viewport dimensions. - Added utility functions for color parsing and box model calculations. - Integrated Tailwind CSS for styling and improved scrollbar aesthetics. - Implemented unit tests for color utilities and rectangle calculations. - Configured TypeScript and Vite for the project setup.
23 lines
800 B
TypeScript
23 lines
800 B
TypeScript
import { defineConfig } from 'vite';
|
|
import VueJsxVapor from 'vue-jsx-vapor/vite';
|
|
import tailwindcss from '@tailwindcss/vite';
|
|
import webExtension from 'vite-plugin-web-extension';
|
|
|
|
// Element Inspector — Chrome MV3 extension.
|
|
// JSX is compiled to Vue Vapor (no interop); Tailwind v4 compiles the overlay styles,
|
|
// which are injected into a Shadow DOM at runtime. `webExtension` wires the manifest
|
|
// entrypoints (background + content script) into the build.
|
|
export default defineConfig({
|
|
plugins: [
|
|
VueJsxVapor(),
|
|
tailwindcss(),
|
|
webExtension({
|
|
manifest: 'manifest.json',
|
|
browser: 'chrome',
|
|
// Just build/watch into dist/ — we load it unpacked ourselves rather than
|
|
// auto-launching a browser via web-ext.
|
|
disableAutoLaunch: true,
|
|
}),
|
|
],
|
|
});
|