this is a webpack loader of pxtovw
npm install pxtovw-loader -D
module.exports = {
// ...
module: {
rules: [{
test: /\.css$/,
use: [{
loader: 'style-loader'
}, {
loader: 'css-loader'
}, {
loader: 'pxtovw-loader',
options: {
unitToConvert:'px', //Custom conversion unit
viewportWidth: 1080, //Viewport width
unitPrecision: 5, //retain decimal places
minPixelValue: 2 // minimum conversion value
}
}]
}]
}
}
npm i postcss-loader pxtovw-postcss -D
webpack.config.js
module.exports = {
module: {
rules: [
{
test: /\.css$/,
use: [
'style-loader',
{ loader: 'css-loader', options: { importLoaders: 1 } },
'postcss-loader'
]
}
]
}
}
postcss.config.js
module.exports = {
plugins: {
"pxtovw-postcss" : {
unitToConvert:'px', //Custom conversion unit
viewportWidth: 1080, //Viewport width
unitPrecision: 5, //retain decimal places
minPixelValue: 2 // minimum conversion value
}
}
}