Remixjs - 如果使用 css 模块，元素没有类

Question

Remix 似乎支持 CSS 模块。

我已经安装了

@remix-run/css-bundle

并从中导入

cssBundleHref

并将其添加到

root.tsx

中的链接描述符中。

import { cssBundleHref } from "@remix-run/css-bundle";


export const links: LinksFunction = () => [
  ...(cssBundleHref
    ? [{ rel: "stylesheet", href: cssBundleHref }]
    : [])] 

这是

Main.tsx

使用css模块的地方。

import React from "react";
import stylesUrl from "~/components/message/Main.module.css" 
export const Main = () => {
  return (
    <main className={stylesUrl.main}>
      <h1>CSS Module</h1>
    </main>
  );
};

在浏览器中，

main

没有类。

 <main className={stylesUrl.main}>
    <h1>CSS Module</h1>
 </main>

如何在 Remix 中使用 css 模块？

Answer 1

我遇到了同样的问题 - 确保你的 @remix-run/* 包都在同一版本上。

https://github.com/remix-run/remix/discussions/6803