babel-plugin-react-css-modules
babel-plugin-react-css-modules copied to clipboard
Can I use webpack resolve.extensions = [".css"] and use import './table' instead of './table.css' in js
Course

// webpack.config.js
resolve: {
extensions: ['*', '.js', '.json', '.jsx', '.tsx', '.ts', '.css', '*.css', '.scss'],
},
// RuntimeStyleResolution.js
/**
* @file Demonstrates runtime "styleName" resolution.
* @see https://github.com/gajus/babel-plugin-react-css-modules#runtime-stylename-resolution
*/
import React from 'react';
import './table';
export default () => {
return <div styleName='table'>
<div styleName='row'>
<div styleName={'cell' + (Math.random() > 0.5 ? ' yellow' : '')}>A2</div>
<div styleName={'cell' + (Math.random() > 0.5 ? ' yellow' : '')}>B2</div>
<div styleName={'cell' + (Math.random() > 0.5 ? ' yellow' : '')}>C2</div>
</div>
</div>;
};
I try to debug. It's your notForPlugin function in index.js return false while
extension === './table'
not './table.css' course the problem.