本文章默认基于“vue init webpack myproject”已经搭好基本的项目,

而且本文是从我有道笔记拷贝稍加修改过来的

本来我私人笔记写给自己看的所以有些地方可能描述不够清晰


需要修改的文件就两个:build/webpack.base.conf.js  src/main.js


第一步:安装依赖

npm install vux --save

npm install vux-loader --save-dev

npm install less less-loader --save-dev

第二步:修改build/webpack.base.conf.js中的代码(引入vux-loader)

const vuxLoader = require('vux-loader')


第三步:继续修改build/webpack.base.conf.js中的代码

原来的 module.exports 代码赋值给变量 webpackConfig,这里特意截图说明详细点,担心有看不懂的同学

第四步:继续修改build/webpack.base.conf.js中的代码

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


第五步:在src/main.js中调用plugin( 以下是使用过程,反正跟着炒就是了 )

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

以上就是vux 安装以及配置


现在举个例子,最简单的组件引入过程:

<Divider>文本分割线</Divider>

import { Divider } from 'vux'
components: { Divider },

写的比较仓促,赶着吃午饭。。。

vue项目安装vux的更多相关文章

  1. 如何在你的Vue项目配置vux

    做移动端项目的话vue现在是首要的选择,足够轻便,文档足够全,当然用的人多,项目中遇到的坑别人可能也遇到过,解决起来也比较方便,至于在开发中做需要的移动端组件库,个人比较推崇vux. 其实项目里组件库 ...

  2. VUE项目安装

    连接转载:https://www.cnblogs.com/Colwill-Blog/p/6682091.html 刚刚开始学习Vue.js.今天分享一下我的Vue项目安装过程. 我是windows系统 ...

  3. vue项目使用vux框架配置教程

    吐槽下,这个vux配置教程那..写的实在是坑,也不搞个示例代码...想上天吗???? 正常安装的话...100%报错...以下是正确配置 1.项目里安装vux   npm install vux -- ...

  4. vue项目安装sass/scss

    vue 添加scss 安装好之后使用: 注意scss和sass的语法区别,scss是用传统花括号,sass是缩进控制,看个人习惯选择语言 sass语法看这里==>sass基本语法 vue项目编译 ...

  5. vue-cli新建vue项目安装axios后在IE下报错

    使用脚手架新建了一个vue项目,可以在IE9+浏览器运行,但是在添加了axios后,在IE下就报错了 首先是安装axios,在命令行执行: $ npm install axios -s //执行命令, ...

  6. vue项目中vux的使用

    vux VUX 是基于 WeUI 和 Vue.js 的 移动端 UI 组件库,提供丰富的组件满足移动端(微信)页面常用业务需求. 在vue-cli中使用步骤如下: 1.安装: npm i vux -S ...

  7. 运行vue项目--安装vue脚手架vue cli

    第一步. 安装node: 官网下载node的.pkg,下载地址,选择相应版本进行下载 mac终端下输入npm -v 和 node -v, 出现相应版本号即安装成功. 若均提示 command not ...

  8. Vue项目结合vux使用

    引入vux 1.直接安装或者更新: npm install vux --save 或者使用 yarn yarn add vux // 安装 yarn upgrade vux // 更新 2.vux2必 ...

  9. Vue项目安装CubeUI

    CubeUi GitHub地址:https://github.com/didi/cube-ui install vue add cube-ui 项目中 会多出cube ui 的配置文件来

随机推荐

  1. 聊聊HTML

    HTML简述 What is HTML? HTML是用来描述网页的一种语言,全称超文本标记语言(HyperText Markup Language),它并不是一种编程语言,而是一种标记语言,即一套标记 ...

  2. ASP.NET Core快速入门学习笔记(第1章:介绍与引入)

    课程链接:http://video.jessetalk.cn/course/explore 良心课程,大家一起来学习哈! 任务1:课程介绍 任务2:环境安装 下载地址:https://dotnet.m ...

  3. django信号

    什么是信号? 信号是在某个操作前或后自动触发一些操作. 信号是通知,是一种状态,相当于在某种状态下发特定的消息 --为了实现代码层解耦 村长博客:http://www.cnblogs.com/legu ...

  4. Core在类中注入

    private readonly IHttpClientFactory _iHttpClientFactory; public static NetHelper Get = new NetHelper ...

  5. os模块walk方法

    1.os.walk import os for root, dirs, files in os.walk(top, topdown=False): for name in files: os.remo ...

  6. python+adb实现自动化获取手机信息

    首先我们先看一下使用adb查看Android手机信息的指令 #获取手机名称NAME = 'adb shell getprop ro.product.model'#获取手机版本VERSION = 'ad ...

  7. Beginning Python Games Development

    Like music and movies, video games are rapidly becoming an integral part of our lives. Over the year ...

  8. Vue项目预渲染机制引入实践

    周末想顺便把已经做好静态页面的webApp项目做一下SEO优化,由于不想写蹩脚的SSR代码,所以准备采用预渲染,本来想着网上有这么多预渲染的文章,随便找个来跟着做不就完了嘛,结果年轻的我付出了整个周末 ...

  9. [AGC017D]Game on Tree

    [AGC017D]Game on Tree 题目大意: 一棵\(n(n\le10^5)\)个结点的树.A和B轮流进行游戏,A先手.每次删掉一棵子树,根结点不能删.最先不能操作的人输,问最后谁赢. 思路 ...

  10. U-Boot内存管理

    如<Linux内核内存管理架构>一文中提到,linux内核中的内存管理支持内存地址映射.内存分配.内存回收.内存碎片管理.页面缓存等众多功能.但U-Boot做为启动引导程序,其核心功能就是 ...