vue中引用vux

最新推荐文章于 2021-06-30 15:12:46 发布

weixin_30882895

最新推荐文章于 2021-06-30 15:12:46 发布

阅读量163

点赞数

文章标签： javascript webpack json ViewUI

原文链接：http://www.cnblogs.com/tanxiang6690/p/9042208.html

版权

官网看不懂，网上搜了下，以备不时之需

这是官网说明文档，看不懂的啊。

Vux使用教程：

1，在项目里安装vux

　　cnpm install vux --save

2，在项目里安装vux-loader（这个vux文档中没有明文跟你说要安装的啦）

　　cnpm install vux-loader --save-dev

3，在项目里安装less-loader（这个是用以正确编译less源码，否则会出现 ' Cannot GET / '，自己看package.json，如果安装了，就不用装啦！）

　　npm install less less-loader --save-dev

4，在项目里面的build/webpack.base.conf.js中配置

　　const vuxLoader = require('vux-loader');　　　　　　　　　　　　　　　　　　　　//新怎

　　const webpackConfig = originalConfig;　　　　　　　　　　　　　　　　　　　　//originalConfig就是原来的 module.exports出去的代码，把它整个赋值给变量 webpackConfig

　　module.exports = vuxLoader.merge(webpackConfig, { plugins: ['vux-ui'] });　　　　 //在最后加多一句，这里就是引用插件vux啦！

5，最后别忘了

　　在resolve: {extensions: ['.js', '.vue', '.json','.less']里加入.less。　　

以上为安装和配置方法，接下来我们该运行（npm run dev）整个项目了，看有没有什么报错，若果没有，就可以在项目中引用vux的组件了

　　在templete中写个标签

<loading :show="show1" :text="text1"></loading>
<alert v-model="show" :title="'测试组件？'"> {{ '看看行不行' }}</alert>

　　show1、show跟text1是变量，前者控制是否出现Loading、Alert，后者控制Loading显示内容。

　　在script内，引入组件

import { Loading,Alert} from 'vux';

　　还要在components写上

components: {
    Loading,
    Alert
}

根据文档说，这是以插件形式调用，像我这种小白....算了算了

转载于:https://www.cnblogs.com/tanxiang6690/p/9042208.html

关注