| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677 |
- const tailwindV3Spacing = {
- '0': '0px',
- '0.5': '0.125rem',
- '1': '0.25rem',
- '1.5': '0.375rem',
- '2': '0.5rem', // ml-2 对应值
- '2.5': '0.625rem',
- '3': '0.75rem',
- '3.5': '0.875rem',
- '4': '1rem', // mb-4 对应值(重点修复)
- '5': '1.25rem',
- '6': '1.5rem',
- '7': '1.75rem',
- '8': '2rem',
- '9': '2.25rem',
- '10': '2.5rem',
- '11': '2.75rem',
- '12': '3rem',
- '14': '3.5rem',
- '16': '4rem',
- '20': '5rem',
- '24': '6rem',
- '28': '7rem',
- '32': '8rem',
- '36': '9rem',
- '40': '10rem',
- '44': '11rem',
- '48': '12rem',
- '52': '13rem',
- '56': '14rem',
- '60': '15rem',
- '64': '16rem',
- '72': '18rem',
- '80': '20rem',
- '96': '24rem',
- }
- // tailwind.config.ts
- // 删掉这行:import type { Config } from 'tailwindcss'
- // 手动定义 Tailwind v4 兼容的 Config 类型(覆盖 spacing/colors 等核心配置)
- interface TailwindConfig {
- content: string[];
- safelist?: string[];
- theme: {
- extend: {
- spacing?: Record<string, string>;
- colors?: Record<string, string | Record<string, string>>;
- boxShadow?: Record<string, string>;
- // 如需其他配置(如 fontFamily、screens),按需补充
- };
- };
- plugins?: any[];
- }
- // 配置对象(符合自定义的 TailwindConfig 类型)
- const config: TailwindConfig = {
- content: [
- './app/**/*.{js,ts,jsx,tsx,mdx}',
- './pages/**/*.{js,ts,jsx,tsx,mdx}',
- './components/**/*.{js,ts,jsx,tsx,mdx}',
- ],
- theme: {
- extend: {
- spacing: tailwindV3Spacing,
- colors: {
- blue: {
- 50: '#f0f7ff',
- 600: '#1677ff',
- },
- },
- },
- },
- plugins: [],
- };
- export default config;
|