README

@umijs/max 模板项目，更多功能参考 Umi Max 简介

umi 升级到 umi4 后

1、tailwind 的配置已更改为最新配置 2、可以使用最新的 umi4 api

关于 tailwindcss 配置

Umi 的稳定版本是 3.5.20 ，其（@umijs/bundler-webpack）使用的 PostCSS 版本为 7.0.32 ，而 Tailwind 依赖 PostCSS 的版本为 8.x.x 。因此，我们需要安装兼容 PostCSS 7 的 Tailwind 版本。

yarn add \
 tailwindcss@npm:@tailwindcss/postcss7-compat \
 @tailwindcss/postcss7-compat \
 autoprefixer@^9

修改 Umi 配置完成相关依赖的安装后，我们需要修改 Umi 配置文件（.umirc 或 config/config.ts）的 extraPostCSSPlugins 选项。

import { defineConfig } from "umi";

export default defineConfig({
  // ...
  extraPostCSSPlugins: [require("tailwindcss"), require("autoprefixer")],
  // ...
});

默认情况下，tailwindcss 会识别根目录下的 tailwind.config.js 配置文件。如果我们想指定配置文件的读取路径，可设置 config 属性。

import { defineConfig } from "umi";

export default defineConfig({
  // ...
  extraPostCSSPlugins: [
    require("tailwindcss")({ config: "[custom_path]/tailwind.config.js" }),
    require("autoprefixer"),
  ],
  // ...
});

参考文档：https://zhuanlan.zhihu.com/p/489410215

About

微前端基座项目

Languages

Language:TypeScript 78.4%Language:EJS 15.9%Language:JavaScript 2.7%Language:Less 1.5%Language:CSS 1.5%