0.1.0 • Published 3 years ago
rpx-transform-loader v0.1.0
rpx-transform-loader(WIP)
A webpack loader that can transformed rpx to vw unit for vue's sfc.
Usage
Add the rpx-transform-loader
to module.rules
options in webpack.config.js
:
// webpack.config.js
module.exports = {
// ...
module: {
rules: [
use: /\.vue$/,
loader: "rpx-transform-loader"
]
}
// ...
}
If you use vue-cli, and you can used it in vue.config.js
like this:
// vue.config.js
module.exports = {
// ...
chainWebpacl: (config) => {
config.module
.rule("vue")
.use("rpx-transform-loader")
.loader("rpx-transform-loader")
.end();
},
};
Options
The Options type definition:
interface LoaderOptions {
unit: string
width: number
precision: number
outUnit: string
}
The meaning of each paramter:
name | introduce | type | default |
---|---|---|---|
unit | transformed unit's name | string | rpx |
width | the width of the design draft | number | 750 |
precision | the calculation accuracy | number | 5 |
outUnit | the unit after transform | string | vw |
0.1.0
3 years ago