Stack Overflow
Stack Overflow

Questions tagged [css-modules]

CSS Modules is a pre-processor that allows for emulation of local scope and control dependencies in CSS code.

CSS Modules is a CSS pre-processor that allows for scoping of CSS classes in a local or global context. It works in tandem with JavaScript to generate CSS classes, and requires a loader (such as Webpack or Browserify).

Read the documentation for CSS Modules here.

730 questions
0
votes
1 answer

Using CSS Modules with Modernizr (class names)

Modernizr adds classes to the document's tag, e.g. . In my code, I used to write something like this. .style { background: green; } .no-touchevents .style { background: red; } So the element would be green (OK)…
lmenus
  • 604
  • 9
  • 27
0
votes
1 answer

css modules with webpack lowercase file name

I have the following rule in my webpack.confg use: [ { loader: 'css-loader', query: { modules: true, sourceMap: true, importLoaders: 2, localIdentName: '[name]__[local]___[hash:base64:5]' } …
dagda1
  • 26,856
  • 59
  • 237
  • 450
0
votes
1 answer

css module classes not there in production

I've been using css modules with sass in a react library that I want to be consumed by other libraries. I have the following code for a component: import React, { Component } from 'react'; import styles from './FormInput.scss'; import cs from…
dagda1
  • 26,856
  • 59
  • 237
  • 450
0
votes
0 answers

React - onClick event not firing or updating

I am new to React. I have downloaded and installed code from this "CSS Modules and React" tutorial:- Tutorial: https://css-tricks.com/css-modules-part-3-react/ Code: https://github.com/robinrendle/react-css-modules-boilerplate The downloaded code…
sqwunckly
  • 11
  • 1
  • 3
0
votes
1 answer

Webpack 2 regex test failing

I cant quite get my head around why my loader tests are failing. My goal: Test 1: Match anything that is not either global.css or global.scss Test 2 Only match either global.scss or global.css Reason being is i don't want any files named global to…
Samuel
  • 2,485
  • 5
  • 30
  • 40
0
votes
2 answers

CSS module not working on react component

I am trying to use css module in my reactjs application. I have added the loader in webpack.config file. { test: /\.css$/, loader:…
EdG
  • 2,243
  • 6
  • 48
  • 103
0
votes
2 answers

CSS modules - print stylesheet - how to override classes

How to create a print stylesheet which can override the dynamic styles created by css modules ? Using CSS modules, classnames render with unique names like so : In my…
looshi
  • 1,226
  • 2
  • 9
  • 23
0
votes
1 answer

How to give classes in CSS modules better names?

I have this config in webpack.config.js: { test: /\.css$/, use: [ {loader: "style-loader"}, { loader: "css-loader", options: { modules: true, importLoaders: 1, sourceMap: true …
Sergei Basharov
  • 51,276
  • 73
  • 200
  • 335
0
votes
0 answers

Getting error when build production build with webpack and extract-text-plugin

I have an error when trying to build a production build of my React application: /home/andrey/Projects/Datarisk/app-frontend/node_modules/extract-text-webpack-plugin/index.js:28 if(c.isInitial()) return; ^ TypeError:…
Andrey Luiz
  • 461
  • 9
  • 25
0
votes
1 answer

React CSS Modules and testing the component

Inside my code I use babel-plugin-react-css-modules which is practically the same as react-css-modules I have a code like this inside react component. styleName is for CSS Modules and I define styles for them inside…
Igor-Vuk
  • 3,551
  • 7
  • 30
  • 65
0
votes
1 answer

Preventing a multitude of style-related React props using CSS Modules

In my project, I have a Text component: import React from 'react' import { bool, string, number, element, func, object, any } from 'prop-types' import cx from 'classnames' import s from './styles/Text.css' const Text = (props) => { const…
alanbuchanan
  • 3,993
  • 7
  • 41
  • 64
0
votes
2 answers

How to set up css-modules?

Official documentation way too complicated and not working for me. Does anyone know any good article how to set up css-modules with webpack? react-css-modules didn't help either Update Here is my modules config. It was edited while trying to reach…
Vitalii Korsakov
  • 45,737
  • 20
  • 72
  • 90
0
votes
1 answer

React Server Side Rendering (CSS Module ) FOUC issue

I hava got a FOUC issue with react server side rendering. I used React+ReactRouter+Redux Here is main tech stacks I think it necessary to list: CSS Module deal with component style extract-text-webpack-plugin for generating separate css…
Betamee
  • 13
  • 4
0
votes
1 answer

Allow an object (for CSS Modules) to be passed to ReactCSSTransitionGroup for Flow validation

I am using ReactCSSTransitionGroup, CSS Modules, and Flow.
alanbuchanan
  • 3,993
  • 7
  • 41
  • 64
0
votes
1 answer

CSS modules multiple localIdentName

Is it possible to change the localIdentName when using CSS modules in Webpack so that I can apply multiple class names? My ultimate goal is to do something like this: css?modules&localIdentName=[[name]-[local] [hash]] where the class names that…
Matt Derrick
  • 5,674
  • 2
  • 36
  • 52
1 2 3
…
48 49