Стили не импортируются в компонент - PullRequest
Новая
       45

Стили не импортируются в компонент

1 голос
/ 17 мая 2019

Я пытаюсь импортировать стили из файла CSS и не могу ничего импортировать.Вот как я его импортирую 

import React    from 'react'

import * as styles from './styles.css'

/* eslint-disable */
console.log('******************************************')
console.log(styles) // /styles.[hashValue].css
console.log('******************************************')

export default function SideNav() {
  return (
    <div className={'navBar'}>{'Side Nav'}</div>
  )
}

Я использую Webpack для комплектации.Вот код CSS-обработчика:

/ * eslint-disable import / no-посторонние зависимости * / import MiniCssExtractPlugin из 'mini-css-extract-plugin' 

const devStyleConfig = [
  {
    loader  : MiniCssExtractPlugin.loader,
    options : {
      hmr : true
    }
  },
  {
    loader  : 'css-loader',
    options   : {
      importLoaders    : 1,
      modules          : true,
      sourceMap        : false,
      camelCase        : true,
      localIdentName   : '[path][name]--[local]--[hash:base64]'
    }
  },
  {
    loader  : 'postcss-loader'
  }
]

export default devStyleConfig

Вот ссылка на мою полную конфигурацию веб-пакета .Не уверен, что мне здесь не хватает.

1 Ответ

0 голосов
/ 17 мая 2019

У вас должны быть CSS-модули вроде этого 

{
  test: /\.css$/,
  loader: 'style!css-loader?modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]' 
}

Ссылочная ссылка для другого soulution

...