vux是移动端UI组件库 https://vux.li/demos/v2/#/
在项目里打开终端 输入命令行 安装vux:npm i -s vux
在package.json 中可以看到安装的依赖版本号

记得安装 npm i -D less less-loader
还要安装 npm install vux-loader --save-dev
然后在build/webpack.base.conf.js中 修改
const vuxLoader = require('vux-loader')
const webpackConfig =

然后在最下面添加
module.exports = vuxLoader.merge(webpackConfig, {
plugins: ['vux-ui']
})

然后就会在body里面成功添加vux_view_box_body 这个div

在App.vue清样式咯
html,body{
margin: 0;
width: 100%;
height: 100%;
overflow-x: hidden;
}
记得给最外层的添加高度为100% 不然会撑不起来
#app{
height: 100%;
}

然后引入样式重置 直接在html,body上面引入就行
@import '~vux/src/styles/reset.less';
会报错 需要<style>中添加 lang="less"
<style style="less">
网友评论