Класс CSS Webpack не применяется к элементам HTML и компонентам React.CSS

Разбираемся в CSS
Ответить Пред. темаСлед. тема
Anonymous
 Класс CSS Webpack не применяется к элементам HTML и компонентам React.

Сообщение Anonymous »


Я создал проект с использованием Webpack, Lit2 и React.

У меня проблема с таблицами стилей CSS и компонентами React. Я создал таблицу стилей homesheet.module.css и импортировал ее в свой компонент React.

импортировать стили из '../homesheet.module.css'; экспортировать const CustomDivider = () => { возвращаться ( ); }; Мои конфигурации Webpack:

// Для наших модулей CSS они будут локально ограничены const CSSModuleLoader = { загрузчик: 'css-загрузчик', параметры: { модули: { localIdentName: '[имя]_[локальный]_[хэш:base64:5]', }, импортЗагрузчики: 1, sourceMap: false, // отключено, поскольку вызывает задержку } } // Для наших обычных CSS-файлов мы хотели бы, чтобы они были глобальными константный CSSLoader = { загрузчик: 'css-загрузчик', параметры: { импортЗагрузчики: 1, sourceMap: false, // отключено, поскольку вызывает задержку } } // Загрузчик стандартного стиля (здесь описаны продукты и разработчики) константный стильLoader = devMode? 'стиль-загрузчик': MiniCssExtractPlugin.loader; модуль.экспорт = { вход: { приложение: './index-app.js', }, модуль: { правила: [ { тест: /\.(js|jsx)$/, исключить: /node_modules/, использовать: { загрузчик: 'babel-loader', параметры: { пресеты: ['@babel/preset-react'], }, }, }, { тест: /\.css$/, исключить: /\.module\.css$/, используйте: [styleLoader, CSSLoader] }, { тест: /\.module\.css$/, используйте: [styleLoader, CSSModuleLoader] } ], }, решать: { расширения: ['.*', '.js', '.jsx'], }, плагины: [ новый HtmlWebpackPlugin({ имя файла: 'index.html', шаблон: './index.html', }), новый MiniCssExtractPlugin({ имя файла: "[имя].css", chunkFilename: "[id].css", }), ], выход: { имя файла: '[имя].bundle.js', путь: path.resolve(__dirname, 'build'), чистый: правда, }, }; Если я создаю проект, перехожу на интересующую меня страницу в любом браузере и открываю инспектор, я вижу свой элемент с назначенным именем класса, но стиль не применяется и класс не отображается на вкладке «Стиль» инспектора.

час от инспектора

стили часов из инспектора

У меня нет ошибок консоли. Можете ли вы помочь мне разобраться в этом? Я везде проверил.

Я пытался изменить файл конфигурации веб-пакета, установил css-loader и style-loader. Я также пытался использовать и импортировать CSS-лист без модуля, но ничего не помогло.
Реклама
Ответить Пред. темаСлед. тема

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

  • Похожие темы
    Ответы
    Просмотры
    Последнее сообщение

Вернуться в «CSS»