gajus / gajus/babel-plugin-react-css-modules
Couldn't resolve some "scss" syntax such as this ?
- Ngôn ngữ chính
- JavaScript
- Star
- 2k
- Fork
- 159
- Chỉ số merge pull request
- Không có pull request nào được merge trong 30 ngày
Mô tả
``` scss
:local
.chat-list{
background: red;
min-height: 200px;
&__item{
padding: 20px 30px;
background: lightcoral;
display: flex;
&-avatar{
width: 80px;
height: 80px;
background: lightgoldenrodyellow;
}
&-col-2{
flex: 1;
&-row-1{
display: flex;
}
}
}
}
```
use
``` jsx
import a from './style.scss'
console.log(a)
export default function Chats () {
return
{/*
}
```
and then
``` console
Module build failed (from ./node_modules/babel-loader/lib/index.js):
Error: CSS module does not exist: chat-list__item
at getClassNameForNamespacedStyleName (D:\angle\task-mobile-web\node_modules\babel-plugin-react-css-modules\dist\getClassName.js:47:13)
at styleNameValue.split.filter.map.styleName (D:\angle\task-mobile-web\node_modules\babel-plugin-react-css-modules\dist\getClassName.js:68:14)
at Array.map ()
at exports.default (D:\angle\task-mobile-web\node_modules\babel-plugin-react-css-modules\dist\getClassName.js:66:6)
at exports.default (D:\angle\task-mobile-web\node_modules\babel-plugin-react-css-modules\dist\resolveStringLiteral.js:23:56)
at PluginPass.JSXElement (D:\angle\task-mobile-web\node_modules\babel-plugin-react-css-modules\dist\index.js:193:48)
at newFn (D:\angle\task-mobile-web\node_modules\@babel\traverse\lib\visitors.js:193:21)
at NodePath._call (D:\angle\task-mobile-web\node_modules\@babel\traverse\lib\path\context.js:53:20)
at NodePath.call (D:\angle\task-mobile-web\node_modules\@babel\traverse\lib\path\context.js:40:17)
at NodePath.visit (D:\angle\task-mobile-web\node_modules\@babel\traverse\lib\path\context.js:88:12)
```
Hướng dẫn đóng góp
Chưa lập chỉ mục được hướng dẫn đóng góp cho kho mã nguồn này
Hướng nghiên cứu
Bắt đầu với luồng được báo cáo qua dist/index.js, dist/resolveStringLiteral.js và dist/getClassName.js, sử dụng ví dụ SCSS và JSX lồng nhau làm trường hợp tái hiện. Truy vết lý do tên được tạo chat-list__item không được phân giải, sau đó xác minh rằng ví dụ được chuyển đổi mà không gặp lỗi CSS-module.
Do mô hình lập chỉ mục viết ra từ nội dung của issue.
Đánh giá
- Công nghệ
- javascript, react, scss
- Lĩnh vực
- frontend, tooling
- Loại issue
- Lỗi
- Độ khó
- 3/5
- Thời gian dự kiến
- 1-2 ngày
- Mức độ hoạt động
- Đình trệ
- Độ rõ ràng
- Khá rõ ràng
- Mức phù hợp với người mới
- 35/100