vite-plugin-webcomponent-style-helper/dist/main.d.cts

Vite plugin for automatically importing Element Plus styles in Web Components

import { PluginOption } from 'vite';
import pm from 'picomatch';

/**
 * Vite 插件配置选项
 * 用于自动导入 Web Component 中使用的 UI 组件样式
 */
interface VitePluginWebComponentStyleHelper {
    /** SASS/CSS 样式文件路径前缀，例如：'element-plus/theme-chalk/src' */
    stylePathPrefix?: string;
    /** 要匹配的组件标签前缀，例如：'el' 匹配 ElementUI 组件 */
    UITagPrefix?: string;
    /** 样式文件后缀名 */
    fileSuffix?: 'scss' | 'css';
    /**
     * 自定义样式文件解析器
     * @function customStyleResolver
     * @param componentName 匹配出来的组件名称；
     *
     * 返回示例：
     * @use 'element-plus/theme-chalk/src/message.scss';
     * 或
     * @use 'element-plus/theme-chalk/message.css';
     * */
    customStyleResolver?: (componentName: string, options: VitePluginWebComponentStyleHelper) => string;
    /** 是否启用调试模式 */
    debug?: boolean;
    /**
     * 是否自动插入 unocss shadow-dom
     * https://unocss-cn.pages.dev/integrations/vite#shadow-dom
     * */
    useUnocss?: boolean;
    /** 需要处理的文件 */
    matchRules?: pm.Glob;
    /** 需要注入的公共样式文件 注意不要携带尾随分号 例：["@use 'element-plus/theme-chalk/src/base.scss'"] */
    commonCss?: string[];
}
/**
 * Vite 插件主函数
 * 自动为 Web Component 导入使用的 UI 组件样式
 * @param options 插件配置选项
 * @returns Vite 插件对象
 */
declare function webComponentStyleHelper(options?: VitePluginWebComponentStyleHelper): PluginOption;

export { type VitePluginWebComponentStyleHelper, webComponentStyleHelper as default, webComponentStyleHelper };