vux环境配置

 

第一步

在vue项目中的package.json文件的dependencies中添加下面三行,即安装vux及其相关依赖

"vux":"^2.7.3",
"vux-loader": "^1.1.26",
"less-loader": "^4.0.5"

npm install 安装上面依赖

 

第二步

在bulid —>webpack.base.conf.js下,

1)首先引入vux-loader

const vuxLoader = require('vux-loader')

 

2)然后将原来的module.exports 替换成const webpackConfig,然后在最底下写上这么一段代码

module.exports = vuxLoader.merge(webpackConfig, {
    plugins: ['vux-ui']
})

 

第三步

vux引入成功,可以在vue文件直接  import { XXX, XXX }  from  'vux' 啦!!!

vux的使用可参照下面例子

<template>
    <x-header>2017年满意度调查</x-header>
</template>
<scirpt>
    import { XHeader, Confirm} from 'vux'
    export default {
        components: {
            Confirm,
            XHeader
        }
    }
</script>

 

 

 

VUX部分坑

如果你想直接在组件中的methods方法里面 this.$vux.comfirm.show({....}) 这样调用,你就需在main.js里面配置如下

import { AlertPlugin, ToastPlugin, ConfirmPlugin } from 'vux'
Vue.use(AlertPlugin)
Vue.use(ToastPlugin)
Vue.use(ConfirmPlugin)

 

posted @ 2017-11-19 12:50  彭胜光  阅读(4959)  评论(0编辑  收藏  举报