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'],
}