Typescript + React + css modules 遇到的坑

发布于 2022-09-11 21:55:32 字数 365 浏览 12 评论 0

  1. 在使用ts编写react代码时,对css模块化配置,使用typings-for-css-modules-loader 依赖于css-loader(0.x版本) 就不会出现这个问题, 但是现在我的css-loader(3.x)版本的 查看了一下 node_modules 下css-loader的内容 完全不一样。请问各位大侠,除了降级css-loader版本 还有别的办法解决这个问题嘛?

其他的 react css模块化处理方式 还有哪些?

  1. 抛出如下错误:

clipboard.png

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

昵称有卵用 2022-09-18 21:55:32

特地去看了下typings-for-css-modules-loader,作者已经不在维护,不过有其他开发者fork了代码发布了新版本。参见issue:https://github.com/Jimdo/typi...

可以尝试安装这个版本:

npm install --save-dev @teamsupercell/typings-for-css-modules-loader

对应的源码:https://github.com/TeamSuperc...

青春如此纠结 2022-09-18 21:55:32

采用@teamsupercell/typings-for-css-modules-loader成功解决问题,同时还需再css-loader中进行相应的配置
const typingsForCssModulesLoaderConf = {

loader: '@teamsupercell/typings-for-css-modules-loader',
options: {
    formatter: "prettier"
}

};
开发环境配置:
{

test: /\.scss$/,
include: path.resolve(__dirname, './../src'),
use: ['style-loader', typingsForCssModulesLoaderConf, {
    loader: 'css-loader',
    options: {
        modules: {
            localIdentName: '[local]_[hash:base64:5]',
        },
        sourceMap: true,
        importLoaders: 2,
        localsConvention: 'camelCase'
    }
}, 'sass-loader', 'postcss-loader']

},

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文