Я пытаюсь интегрировать React + typcript + scss + css-modules.Это идет довольно хорошо, однако я получаю ошибки времени выполнения, потому что реакция была проинструктирована искать в свойстве default
каждого объекта style
, который не существует.Я полагаю, что это может быть связано с тем, как я импортирую стили
import * как стили из './header-styles.scss'
Это основано на рекомендациях ввода-for-css-modules-loader † :
Если вы обнаружите следующие ошибки:
error TS1192: Module '"xxxxx/xxxx/src/style.sass"' has no default export.
возможно, вам следует экспортировать стилиследующим образом:
import * as styles from './style.sass';
Я получил эту ошибку, поэтому переключился на этот синтаксис.
Если я проверяю объект style
, находясь в точке останова, установленной в Chrome напервый ключ React.createElement , I can see my class names are in-tact there. It is just there is this
default` в пути.

Как я могу назначить эти классы объекту default
под style
объект или вообще избавиться от default
?
Соответствующий WebpackConfig.rules:
{
test:/^\.?[\w\-\/]+\.local\.s?css$/,
exclude: /node_modules/,
use: ExtractTextPlugin.extract({
fallback: 'style-loader',
use: [
{
loader: 'typings-for-css-modules-loader',
options: {
modules: false,
// namedExport: true,
camelCase: true
}
},
{
loader: `sass-loader`,
options: {
sourceMap: true,
includePaths: [resolve(paths.src, 'client')]
}
}
]
})
}
† Чуть ниже GIF VSCode