在vuejs中引入滴滴移动端组件(Mand Mobile)

//在vuejs中引入滴滴移动端组件(Mand Mobile)

1、安装脚手架#

npm install mand-mobile --save
# OR 
yarn add mand-mobile

2、main.js全局引入

import mandMobile from 'mand-mobile'
import 'mand-mobile/lib/mand-mobile.css'
Vue.use(mandMobile)

3、px转rem

npm install postcss-pxtorem -D
# OR 
yarn add i postcss-pxtorem -D

4.postcssrc.js引入

module.exports = {
    "plugins": {
        "postcss-import": {},
        "postcss-url": {},
        // to edit target browsers: use "browserslist" field in package.json
        "autoprefixer": {
            browsers: ['Android >= 4.0', 'iOS >= 7']
        },
        'postcss-pxtorem': {
            rootValue: 100, //结果为：设计稿元素尺寸/16，比如元素宽320px,最终页面会换算成 20rem
            propList: ['*']
        }
    }
}

以上是编程学习网小编为您介绍的“在vuejs中引入滴滴移动端组件(Mand Mobile)”的全面内容，想了解更多关于 vuejs 内容，请继续关注编程基础学习网。