Vux的安裝使用
1、Vux的安裝
1.1、vue-cli的vux模板生成項目
可以直接使用 vue-cli 的模板生成一個 vux 項目
vue init airyland/vux2 projectName
由此可以直接使用 vux。（或許運行項目可能會報錯，那是 vue-cli 初始項目的通病）
1.2、手動安裝 vux
首先在項目里安裝vux
npm install vux --save
安裝vux-loader
npm install vux-loader --save-dev
安裝less-loader
npm install less less-loader --save-dev
然后在build/webpack.base.conf.js 文件里修改配置：
加上： const vuxLoader = require('vux-loader')，將 module.exports 后面的對象賦值給變量 webpackConfig，最后在代碼后面添加 module.exports = vuxLoader.merge(webpackConfig, { plugins: ['vux-ui'] })。示例：
'use strict' const path = require('path') const utils = require('./utils') const config = require('../config') const vueLoaderConfig = require('./vue-loader.conf') const vuxLoader = require('vux-loader') ... const webpackConfig = { ... } module.exports = vuxLoader.merge(webpackConfig, { plugins: ['vux-ui'] })
這樣就可以在項目中使用 vux 了，比如在 HelloWorld.vue 文件中
<template>
<div class="hello">
<h1>{{ msg }}</h1>
<group title="cell demo">
<cell title="VUX" value="cool" is-link></cell>
</group>
</div>
</template>
<script>
import { Group, Cell } from 'vux'
export default {
name: 'HelloWorld',
components: {
Group,
Cell
},
data () {
return {
msg: 'Welcome to Your Vue.js App'
}
}
}
</script>
<style scoped>
</style>
參考：https://blog.csdn.net/revival_liang/article/details/78267992
浙公網安備 33010602011771號