Модули CSS из node_modules не внедряют классы при импорте в файл CSS - PullRequest
Новая
       42

Модули CSS из node_modules не внедряют классы при импорте в файл CSS

0 голосов
/ 19 октября 2019

Когда я импортирую css в файл js (например, import style from './node_modules/package/css/input.css'), все в порядке. Но когда я пытаюсь импортировать его в css, он не внедряет классы в компонент

input.styl 

@import '~package/css/input.css'

.color
  color: red

input.tsx 

import style from './input.styl'

function Input() {
  return (
    <div className={ style.container }>
      <input className={ style.color } />
    </div>
  )
}

Выводится файл css: .container-wGX2p {...} .color-3NOmr {...}

Но в отображаемом html-элементе нет импортированного класса div: <div><input class="color-3NOmr"></div>

Конфигурация Webpack: 

{ test: /\.tsx?$/i,
  use: [
    'babel-loader',
    { loader: 'ts-loader',
      options: {
        transpileOnly: true,
      }
    }
  ],
},
{ test: /\.styl$/i,
  use: [
    { loader: MiniCssExtractPlugin.loader,
      options: {
        publicPath: '/assets/',
      }
    },
    { loader: 'css-loader',
      options: {
        localsConvention: 'camelCase',
        modules: {
          localIdentName: '[local]-[hash:base64:5]',
        }
      }
    },
    'postcss-loader',
    'stylus-loader'
  ]
},
...