@dt-frames/plugins v3.0.2

vite插件配置

插件详细说明

文档地址

项目自定义的打包插件，包含assets文件拷贝，打包情况分析，文件压缩，dts等插件，以及其它vite相关的配置。

使用

// @dt-frames/plugins 会暴露函数 ithinkDt(params: IThinkDTOptions) => Plugin[]

interface IThinkDTOptions {
    // 是否为lib包
    lib?: boolean
    // 是否需要分析文件
    inspect?: boolean
    // 是否为打包模式
    isBuild?: boolean
    // 是否向下兼容
    legacy?: boolean,
    // 打包后资源分析
    showStats?: boolean,
    // 文件自动导入
    autoImportCom?: boolean
}


// 项目中具体使用
import { ithinkDt } from '@dt-frames/plugins'
...
export default ( { command, mode } ) => {
    return {
        // ...
        plugins: [
            ithinkDt({
                legacy: true,
                isBuild: command === 'build'
            })
        ]
    }
}

项目打包插件

@vitejs/plugin-vue: 提供对 Vue 单文件提供支持

@vitejs/plugin-vue-jsx: 支持jsx组件

vite-plugin-inspect: 检查你项目的模块和栈信息

vite-plugin-dts: 用于从 .ts 或 .vue 源文件生成 .d.ts 文件的 Vite 插件

vite-plugin-compression: 用于开启gzip文件压缩

vite-plugin-pwa: 0配置自动更新代码

vite-plugin-vue-setup-extend: setup设置name

unplugin-auto-import: 自动导入变量

unplugin-vue-components: 组件自动导入

rollup-plugin-visualizer: 打包文件可视化

vite-aliases: 路径别名

vite-plugin-pages: 自动生成路由配置