Vite+Postcss报错：Cannot find module './page'，重导出组件失败

这个错误的核心原因是postcss-preset-mantine插件在扫描文件时，错误地将TypeScript文件中的导入路径当成CSS相关模块解析，而你的重导出代码未指定文件扩展名，导致PostCSS尝试寻找无扩展名的./page文件，最终匹配失败。

快速修复方案 #

在重导出时明确指定文件扩展名：

// src/pages/index.ts
export { LoginPage } from './login/page.tsx'

其他排查优化方向 #

• 确认Vite路径解析配置：确保Vite的扩展名解析列表包含.tsx，避免路径解析歧义：

  // vite.config.ts
  export default defineConfig({
    resolve: {
      extensions: ['.ts', '.tsx', '.js', '.jsx'],
    },
  })
  

• 限制PostCSS插件扫描范围：给postcss-preset-mantine添加排除规则，避免它解析TS/TSX文件：

  // postcss.config.cjs
  module.exports = {
    plugins: {
      tailwindcss: {},
      autoprefixer: {},
      'postcss-preset-mantine': {
        exclude: ['**/*.ts', '**/*.tsx']
      },
      'postcss-simple-vars': {
        variables: {
          'mantine-breakpoint-xs': '36em',
          'mantine-breakpoint-sm': '48em',
          'mantine-breakpoint-md': '62em',
          'mantine-breakpoint-lg': '75em',
          'mantine-breakpoint-xl': '88em',
        },
      },
    },
  };
  

内容的提问来源于stack exchange，提问作者kamolmachine