标签:uil dev fun 自适应 插件 name com 淘宝 main
一、安装淘宝插件 lib-flexible
npm i -S amfe-flexible
main.js中引入 import ‘lib-flexible‘
index.html的头部加入手机端适配的meta代码(以下二选一)
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<meta name="viewport" content="width=device-width, initial-scale=0.5, minimum-scale=0.5, maximum-scale=0.5, user-scalable=no">
二、安装 px2rem-loader
npm install px2rem-loader -S
在build 下的 utils.js 的 exports.cssLoaders 中配置
const px2remLoader = {
loader: ‘px2rem-loader‘,
options: {
remUnit: 144 // 设计图的1/10
} }
在 function generateLoaders (loader, loaderOptions) 中修改
const loaders = options.usePostCSS ? [cssLoader, postcssLoader] : [cssLoader, px2remLoader]
在项目中,px 会自动转换为 rem
标签:uil dev fun 自适应 插件 name com 淘宝 main
原文地址:https://www.cnblogs.com/zhaohui-116/p/13609107.html