PostCSS предустановленные env alpha hex цвета не работают с переменными sass - PullRequest
0 голосов
/ 09 сентября 2018

При использовании postcss-preset-env я получаю следующие результаты:

$black: #000000; 
color: #{$black}de;

При разработке возвращается ожидаемое:

color: rgba(0, 0, 0, 0.87059);

Но в производстве:

color: #000de;

В package.json у меня есть следующие сценарии:

"dev": "cross-env webpack-dev-server --config webpack.config.js --mode=development -w --hot",
"prod": "cross-env webpack --config webpack.config.js --mode=production -p"

И в webpack.config.js

{
    test: /\.(sa|sc|c)ss$/,
    exclude: ['/node_modules', './dist', '/src/js', '/docs'],
    use: [
        MiniCSSExtractPlugin.loader,
        {
            loader: 'css-loader',
            options: {
                sourceMap: true,
                minimize: process.env.NODE_ENV === 'production',
            }
        },
        {
            loader: 'postcss-loader',
            options: {
                sourceMap: true,
                syntax: postCssScss,
                plugins: () => [
                    autoprefixer,
                    postCssPresetEnv({
                        stage: 0,
                        features: {
                            'color-mod-function': true,
                            'alpha-hex-colors': true
                        }
                    }),
                ],
            },
        },
        {
        loader: 'sass-loader',
            options: {
                sourceMap: true
            }
        }
    ]
}

Я пытался использовать его без части featuresэто не сработало.Также пытались потребовать color-mod-function и alpha-hex-colors в качестве отдельного пакета после autoprefixer, который также не работал.

Так как же получить такой же результат от разработки в производстве?

Уже сделали проблему , но, возможно, кто-то знает способ решить эту проблему.

...