Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

CSS Module localIdentName #6910

Closed
abubakir1997 opened this issue Apr 26, 2019 · 5 comments
Closed

CSS Module localIdentName #6910

abubakir1997 opened this issue Apr 26, 2019 · 5 comments
Labels

Comments

@abubakir1997
Copy link

abubakir1997 commented Apr 26, 2019

Problem

Currently react uses [filename]\_[classname]\_\_[hash] for localIdentName when using CSS Modules. This causes an issue if the filename contains a period, since a period is not a valid character in css class names.

Example

Filename: product.drawer.module.css
ClassName: .SomeClass {}
Generated ClassName: product.drawer_SomeClass_[hash]

Suggestion

  • Remove the period from the class name (Allowing for period filenames)
  • Or, clarify in the docs that filenames should not contain invalid css class name characters such as periods.
@para27rsh
Copy link

para27rsh commented Apr 26, 2019

in the new version, I am not able to use the CSS module

Layout.module.css

.Content {
  margin-top: 16px;
}

Layout.js

`import React from "react";
import Aux from "../../hoc/Aux";
import styles from "./Layout.module.css";
const Layout = props => {
  console.log(styles.Content);
  return (
    <Aux>
      <div>Toolbar,SideDrawer,Backdrop</div>
      <main className={styles.Content}>{props.children}</main>
    </Aux>
  );
};

export default Layout;
`

here {styles.Content} is not working

@stale
Copy link

stale bot commented May 26, 2019

This issue has been automatically marked as stale because it has not had any recent activity. It will be closed in 5 days if no further activity occurs.

@stale stale bot added the stale label May 26, 2019
@abubakir1997
Copy link
Author

What is the value of styles is it undefined? @para27rsh

@stale stale bot removed the stale label May 26, 2019
@stale
Copy link

stale bot commented Jun 25, 2019

This issue has been automatically marked as stale because it has not had any recent activity. It will be closed in 5 days if no further activity occurs.

@stale stale bot added the stale label Jun 25, 2019
@stale
Copy link

stale bot commented Jun 30, 2019

This issue has been automatically closed because it has not had any recent activity. If you have a question or comment, please open a new issue.

@stale stale bot closed this as completed Jun 30, 2019
@lock lock bot locked and limited conversation to collaborators Jul 6, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Projects
None yet
Development

No branches or pull requests

2 participants