我正在使用CSS模块(通过Webpack css加载器)在一个新的React项目中,即使它的工作非常好,我无法使SCSS为
React Select工作.我想象这是因为它尝试创建本地的classNames,JS在反应选择中是不知道的.有没有办法导入整个.scss文件,但是在全局而不是本地的范围?
解决方法
我通常定义两个这样的CSS加载器:
// Global CSS // We make the assumption that all CSS in node_modules is either // regular 'global' css or pre-compiled. loaders.push({ test: /\.css$/,include: /node_modules/,loader: 'style-loader!css-loader' }); // CSS modules loaders.push({ test: /\.css$/,exclude: /node_modules/,loader: 'style-loader!css-loader?modules' });
我以前也将应用程序迁移到CSS模块,发现基于文件扩展名定义一个约定是有用的,例如{filename} .module.css === CSS模块vs {filename} .css ===全局CSS
// Global CSS loaders.push({ test: /\.css$/,exclude: /\.module\.css$/,loader: 'style-loader!css-loader' }); // CSS modules loaders.push({ test: /\.module\.css$/,loader: 'style-loader!css-loader?modules' });