DioxusLabs/dioxus · error · anyhow::Error

Css module file `{}` should end with a `.css` suffix.

Error message

Css module file `{}` should end with a `.css` suffix.

What it means

After reading the file name, process_css_module requires a literal .css suffix so it can strip it and build the hashed module name; strip_suffix(".css") failing produces this error. Normally only .css files are routed here, so seeing it means a file without an exact .css ending reached CSS-module processing.

Source

Thrown at packages/cli/src/opt/css.rs:65

    css_options: &CssModuleAssetOptions,
    source: &Path,
    output_path: &Path,
) -> anyhow::Result<()> {
    let css = std::fs::read_to_string(source)?;

    // Collect the file hash name.
    let mut src_name = source
        .file_name()
        .and_then(|x| x.to_str())
        .ok_or_else(|| {
            anyhow!(
                "Failed to read name of css module file `{}`.",
                source.display()
            )
        })?
        .strip_suffix(".css")
        .ok_or_else(|| {
            anyhow!(
                "Css module file `{}` should end with a `.css` suffix.",
                source.display(),
            )
        })?
        .to_string();

    src_name.push('-');

    let hash = create_module_hash(source);
    let css = transform_css(css.as_str(), hash.as_str()).map_err(|error| {
        anyhow!(
            "Invalid css for file `{}`\nError:\n{}",
            source.display(),
            error
        )
    })?;

    // Minify CSS

View on GitHub (pinned to 393d190a80)

Solutions

1. Rename the file so it ends exactly with lowercase .css (e.g. Button.module.css)
2. Route other extensions through their own preprocessor step and emit .css before the css-module pass
3. Check for trailing whitespace or double extensions in the file name (Button.module.css.txt)

Example fix

// before: does not end with a literal .css suffix
"assets/buttons.module.CSS"  // fails on case-sensitive filesystems

// after
"assets/buttons.module.css"

// Guard before processing
fn is_css_module(p: &std::path::Path) -> bool {
    p.file_name().and_then(|n| n.to_str()).map_or(false, |n| n.ends_with(".css"))
}

fn is_css_module(p: &std::path::Path) -> bool {
    p.file_name().and_then(|n| n.to_str()).map_or(false, |n| n.ends_with(".css"))
}

When it happens

Trigger: Registering or configuring a CSS module whose path does not end exactly with .css — an uppercase .CSS extension on a case-sensitive filesystem, or a .scss/.txt file mistakenly passed with css-module options.

Common situations: Renaming files on case-sensitive Linux CI after developing on macOS/Windows; preprocessing pipelines forwarding .scss output under the wrong extension.

Related errors

• Failed to read name of css module file `{}`.
• Invalid css for file `{}` Error: {}
• Failed to convert wasm bindgen output path to string
• Failed to deserialize asset. Make sure you built with the ma
• Syntax Error in line {line} column {column}: {err}

AI-assisted analysis of DioxusLabs/dioxus@393d190a80 (2026-08-16). Data as JSON: /api/errors/8ab7d01eb50740f3. Report an issue: GitHub.