因为dumi 继承自umi 所以dumi 是可以用umi 的配置文件的,但是稍作修改
第一步:保证umi版本为umi4 第二步:安装@umijs/plugins
pnpm add -D @umijs/plugins
第三步:安装 unocss @unocss
pnpm i unocss @unocss/cli
第四步:配置.dumi.ts
import { defineConfig } from 'dumi';
export default defineConfig({
outputPath: 'docs-dist',
themeConfig: {
name: 'shein-rc',
nav: [
{ title: '组件', link: '/components' },
{ title: 'hooks', link: '/hooks' },
],
},
plugins: [require.resolve('@umijs/plugins/dist/unocss')],
unocss: {
watch: ['src/**/*.tsx'], // 添加其他包含 unocss 的 classname 的文件目录
},
}
此处注意:umi 文档写的是pages 要改成src
watch: ['src/**/*.tsx']
第五步:配置unocss.config.ts
import { defineConfig, presetAttributify, presetUno } from 'unocss';
export function createConfig({ strict = true, dev = true } = {}) {
return defineConfig({
envMode: dev ? 'dev' : 'build',
presets: [presetAttributify({ strict }), presetUno()],
});
}
export default createConfig();
以上是结果方案,尝试了很多,如果有其他的更好方案希望大佬们可以推荐