Webpack импортирует bootstrap и тему нормально и все остальное как модуль - PullRequest
0 голосов
/ 20 февраля 2020

У меня проблемы с получением темы и bootstrap обычно импортируется (по классам), а мои вещи импортируются с использованием модулей s css.

Я взял create-реагировать-приложение и извлек, но у меня есть много маленьких стилей.s css файлов, и я не хочу потом переименовывать все в styles.module.s css. Я предполагал, что смогу сделать это с помощью включений, но я могу заставить их работать, но не вместе. Если я закомментирую первый загрузчик и включаемый модуль, CSS модули работают, и наоборот.

Вот мои модули:

{
    test: /\.(scss|custom\.scss)$/,
    include: [/node_modules\/.*/, path.resolve(__dirname, "src", "styles")],
    use: [
        "style-loader",
        {
            loader: require.resolve("css-loader"),
            options: {
                importLoaders: 3,
                sourceMap: isEnvProduction,
            },
        },
        postCSSLoader,
        {
            loader: require.resolve("sass-loader"),
            options: { sourceMap: true },
        },
    ],
    sideEffects: true,
},
{
    test: /\.(scss|custom\.scss)$/,
    include: [path.resolve(__dirname, "src")],
    use: [
        "style-loader",
        {
            loader: require.resolve("css-loader"),
            options: {
                importLoaders: 3,
                sourceMap: isEnvProduction,
                modules: true,
            },
        },
        postCSSLoader,
        {
            loader: require.resolve("resolve-url-loader"),
            options: { sourceMap: !isEnvProduction, },
        },
        {
            loader: "sass-loader",
            options: {
                sassOptions: {
                    indentWidth: 4,
                    includePaths: [path.join(process.cwd(), "src", "styles")],
                    modules: { getLocalIdent: getCSSModuleLocalIdent },
                },
            },
        },
    ],
    sideEffects: true,
},
{
    test: /\.css$/,
    use: [
        "style-loader",
        "css-loader",
        postCSSLoader,
    ],
    sideEffects: true,
},

Все остальное довольно стандартно. У меня есть тема, которая имеет пользовательский CSS и импортирует bootstrap. Вот вершина моего глобального. css

@import "_variables";
@import "~bootstrap/scss/bootstrap.scss";
@import "../_metronic/_assets/sass/global/integration/frameworks/bootstrap/bootstrap.scss";

Я пробовал много комбинаций, используя включения и исключения, но я не могу заставить его работать. Что-то мне не хватает или что-то еще в веб-пакете мне нужно сделать?

Спасибо за помощь

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...