Webpack raw-loader/style-loader, импортирующий файл CSS в виде строки JavaScript вместо содержимого CSS ⇐ CSS

[Anonymous]

Я использую Webpack для создания расширения Chrome и пытаюсь импортировать файл CSS в виде строки, чтобы можно было внедрить его в теневой DOM. Однако когда я импортирую файл CSS, он импортируется как код JavaScript, а не содержимое CSS.
Содержимое импортированной строки CSS.

Код: Выделить всё

import css from './content.styles.css';
console.log(css);

Код: Выделить всё

    import API from "!../../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js";
import domAPI from "!../../../node_modules/style-loader/dist/runtime/styleDomAPI.js";
import insertFn from "!../../../node_modules/style-loader/dist/runtime/insertBySelector.js";
import setAttributes from "!../../../node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js";
import insertStyleElement from "!../../../node_modules/style-loader/dist/runtime/insertStyleElement.js";
....
....

Вот конфигурация моего веб-пакета

Код: Выделить всё

{
test: /\.css$/,
include: path.resolve(__dirname, 'src/pages/Content'),
use: [
'raw-loader',
{
loader: 'style-loader',
},
{
loader: 'css-loader',
options: {
importLoaders: 1,
},
},
{
loader: 'postcss-loader',
options: {
postcssOptions: {
ident: 'postcss',
plugins: [tailwindcss, autoprefixer],
},
},
},
],
}

До вчерашнего дня все работало нормально, я не вносил никаких изменений в конфигурацию. Это произошло случайно после того, как я выполнил сборку npm в проекте, и теперь каждый раз, когда я запускаю проект, я получаю один и тот же результат. Такое уже случалось раньше, но я думал, что исправил.
Что я пробовал, но не работает

• Изменен порядок загрузчиков.
• удалены все загрузчики и используются только необработанные загрузчики (при этом импортируется CSS, но директивы Tailwind @import игнорируются, а Tailwind не включается в окончательный файл). .)
• Если я удалю style-loader и оставлю css-loader и postcss-loader, я также получу js в импортированной строке.

Просто примечание: у меня есть два правила, использующие приведенную выше конфигурацию. Первое правило предназначено для конкретной папки, а второе правило — для остальных файлов/папок. Во втором правиле я специально исключаю path.resolve(__dirname, 'src/pages/Content'), чтобы он не конфликтовал с первым.
Любая помощь ценно, спасибо!

Подробнее здесь: https://stackoverflow.com/questions/787 ... ng-instead