loader cause PostcssPlugins doesn't work

[yuyeqianxun]

I recently user 'style-resources-loader' cause some plugins not work. I'm not sure where problem it is.

addPostcssPlugins([
    require('postcss-px-to-viewport')({
      ...
    })
  ]),
  addWebpackModuleRule(
    {
      test: /\.less$/,
      use: ['style-loader', 'css-loader', 'less-loader', {
        loader: 'style-resources-loader',
        options: {
            patterns: [
                './src/global/*.less'
            ]
        }
      }]
    }
  ),

or you can use 'postcss-px2rem', it also doesn't work.

[yuyeqianxun]

I am sorry here again,I test them in another project in vue-cli. 'postcss-px-to-viewport' and 'style-resources-loader' can work together.

[luchanan]

Did you find methods？

[yuyeqianxun]

Did you find methods？

No,I run eject finally,or you can try another solution craco recommended by antd;

[luchanan]

I found anohter method：

const { override, addLessLoader, addPostcssPlugins} = require('customize-cra')
module.exports = {
  webpack: override(
    addLessLoader({
      lessOptions: {
        javascriptEnabled: true,
        modifyVars: {
          'hack': `true; @import "~@/assets/less/var.less";`
        }
      }
    }),
    addPostcssPlugins([
      require('postcss-px-to-viewport')({
        viewportWidth: 375
      })
    ])
  )
}

Attention, if addLessLoader behind addPostcssPlugins, it won't be work

[juliana-zhu]

I update version to 'v1.0.0', it's work!

  addLessLoader({
            javascriptEnabled: true,
            modifyVars: {
                hack: `true; @import "~@/assets/styles/mixin.less";`,
            },
            cssLoaderOptions: {}, // .less file used css-loader option, not all CSS file.
            localIdentName: '[local]_[hash:base64:5]',
            cssModules: true,
        }),

[changguilei]

Did you find methods？