Обновление следующей js с 8 до 9.3.3 сломало стиль - PullRequest
Новая
       13

Обновление следующей js с 8 до 9.3.3 сломало стиль

0 голосов
/ 15 апреля 2020

Я только что обновил следующий js с 8 до 9.3.3, и некоторые из моих стилей прервались.

Ранее я импортировал .scss файлы, и они были локально ограничены соответствующими компонентами.

После обновления до 9.3.3 кажется, что компоненты с classNames, которые названы одинаково, теперь совместно используют стили, поэтому я полагаю, что что-то с sass-loader или css -loader в next.config.js кажется выключенным.

это мой next.config.js

const path = require('path');

const dotenv = require('dotenv');
const withSass = require('@zeit/next-sass');
const webpack = require('webpack');

const envConfig = dotenv.config();

const config = withSass({
    cssModules       : true,
    cssLoaderOptions : {
        modules       : true,
        sourceMap     : true,
        importLoaders : 1,
    },
    sassLoaderOptions: {
        includePaths: [path.resolve(__dirname, './')], //eslint-disable-line
    },

    useFileSystemPublicRoutes: false,

    webpack: (config, { buildId, dev, isServer, defaultLoaders }) => { // eslint-disable-line
        const ENV = {};

        for (let entry in envConfig.parsed) {
            ENV[`process.env.${entry}`] = JSON.stringify(envConfig.parsed[entry]);
        }

        config.plugins.push(new webpack.DefinePlugin(ENV));

        return config;
    },
});

module.exports = config;

Что я пробовал

Я изменил свою конфигурацию так: 

const config = withSass({
    cssModules       : true,
    cssLoaderOptions : {
        modules       : {
            mode: 'local',
            exportGlobals: true,
            localIdentName: '[path][name]__[local]--[hash:base64:5]',
            context: path.resolve(__dirname, 'src'), //eslint-disable-line
            hashPrefix: 'my-custom-hash',
        },
        sourceMap     : true,
        importLoaders : 1,
    },
    sassLoaderOptions: {
        includePaths: [path.resolve(__dirname, './')], //eslint-disable-line
    },

    useFileSystemPublicRoutes: false,

    webpack: (config, { buildId, dev, isServer, defaultLoaders }) => { // eslint-disable-line
        const ENV = {};

        for (let entry in envConfig.parsed) {
            ENV[`process.env.${entry}`] = JSON.stringify(envConfig.parsed[entry]);
        }

        config.plugins.push(new webpack.DefinePlugin(ENV));

        return config;
    },
});

module.exports = config;

, который не работал.

Мое последнее средство, которое делает , работает вручную, входя в каждый файл .scss и изменяя их на x.module.scss, что потребовало бы много времени уходит на каждый файл. Что-то не так с моим конфигом?

...