Home

nuxt.config.js

css: [
    {src: 'normalize.css'},
    {src: '~assets/sass/common.scss', lang: 'scss'}
  ],
  build: {
    postcss: [
      require('autoprefixer')({
        browsers: ['last 2 versions', 'Firefox ESR', '> 1%', 'ie >= 8', 'iOS >= 8', 'Android >= 4']
      }),
      require('postcss-pxtorem')({
        rootValue: 100,
      })
    ],
}

common.scss

body{
  display: flex;
  transition:all 1s;
  a{
    color:#ff0
  }
}

output:

body {
    display: flex;
    transition: all 1s;
}

so, how can I use autoprefixer in global scss?

also, I try to use loaders , but ERROR.

nuxt.config.js:

{
            test: /\.scss$/,
            use: [
              'vue-style-loader',
              'style-loader',
              'css-loader',
              {
                loader: 'postcss-loader',
                options: {
                  plugins: () => [
                  require('postcss-pxtorem')({
                    rootValue: 100,
                  }),
                  require('autoprefixer')({
                    browsers: ['last 2 versions', 'Firefox ESR', '> 1%', 'ie >= 8', 'iOS >= 8', 'Android >= 4']
                  }),
                ]
              },
          },
          'sass-loader'],
      }