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

Vux的安装使用的更多相关文章

  1. 在vue中安装使用vux

    最近因为的工作的原因在弄vue,从后端弄到前端之前一直用js,现在第一次接触vue感觉还挺有意思的,就是自己太菜了,这个脑子呀....不太够用.....页面设计用了一个叫vux的东西,vux可以提供一 ...

  2. vue项目中安装使用vux

    vux是个vue的移动端框架. 目前移动端UI框架这么多,为啥选择vux呢?vux虽然说是个个人维护项目,但是有15000+个star,应该不比其他的团队开源框架差. 最重要的是,目前要做微信公众号和 ...

  3. vue移动端组件库vux使用小记

    1.首先安装vux:npm install  vux 2.安装vux-loader:npm install  vux-loader 3.确认是否已安装less-loader:npm  install ...

  4. vux 项目的构建

    一:vux安装 # 安装vuxcnpm install vux --save   # 安装vux-loadercnpm install vux-loader --save-dev   # 安装less ...

  5. laravel5.5+vue+Element-ui+vux环境搭建(webpack+laravelMix)(转)

    本教程例子可到GitHub 上下载 Laravel5.5-Vue-Element-ui-Vux 1.laravel5.5安装,详情请参考: https://laravelacademy.org/pos ...

  6. vux 入门备忘大佬多指点

    一.安装node.js https://nodejs.org/en/ 这样就可以使用npm喽 二.安装vux 安装vux npm install vux --save 安装vux-loader npm ...

  7. vux用法

    其实官网写的很详细了 但是好多时候没有仔细看的耐心 下面基本也是vux官网步骤: 很多人需要$t未定义问题 其实按着官网来就能解决这个报错: 如果你遇到 $t 报错问题,请不要开 issue,升级 v ...

  8. Mac OS X下安装Vue脚手架(vue-cli)

    前言 Vue作为前端三大框架(Angular,React,Vue)之一,号称是最简单,最容易上手的框架,同时也是行内的大趋势,还可以用来开发最火的小程序.具有开发快,双向数据流等特点,有些人认为Vue ...

  9. vux+vuex+vue+Es6开发微信公众号的坑

    初次开发微信公众号遇到很多问题,可能是基础不怎么牢靠,最近几天一直在看vue的东西,现在就来慢慢介绍vux和vue这个骚东西的用法: 细看文档一步步来, npm install vux --save ...

随机推荐

  1. 【web前端】面题整理(2)

    今天是520,单身狗在这里祝各位520快乐! DOM节点统计 DOM 的体积过大会影响页面性能,假如你想在用户关闭页面时统计(计算并反馈给服务器)当前页面中元素节点的数量总和.元素节点的最大嵌套深度以 ...

  2. Java多线程学习——例子:模拟电影院抢座位

    Cinema——List<Integer>数据结构存储电影院座位 public class Cinema{ private List<Integer> seats; //剩余座 ...

  3. python调用java所有代码都要放在jvm开启的时候调用,否则报错: No matching overloads found for in find. at native\common\jp_method.cpp:127

    1.解决方法 开启java虚拟机 jvm 或者先执行结束在关闭java虚拟机jvm

  4. Android中Bitmap对象和字节流之间的相互转换(转)

    android 将图片内容解析成字节数组:将字节数组转换为ImageView可调用的Bitmap对象:图片缩放:把字节数组保存为一个文件:把Bitmap转Byte import java.io.Buf ...

  5. 005 gcc 的简单使用

    0. 前言 本文主要讲关于 gcc 的几种编译方式 不妨设文件名为 test.c 1. 方法一 $ gcc test.c (Windows OS)编译成功的话,没有回馈,在 test.c 所在的文件夹 ...

  6. Python3 AES加解密(AES/ECB/PKCS5Padding)

    class AesEncry(object): key = "wwwwwwwwwwwwwwww" # aes秘钥 def encrypt(self, data): data = j ...

  7. 使用Object.create()实现继承 用 Object.create实现类式继承

    使用Object.create()实现继承:https://www.cnblogs.com/cuew1987/p/4075027.html 用 Object.create实现类式继承:https:// ...

  8. CentOS 8 下 nginx 服务器安装及配置笔记

    参考文档 nginx官方文档 安装 在CentOS下,nginx官方提供了安装包可以安装 首先先安装前置软件 sudo yum install yum-utils 然后将nginx官方源加入到yum源 ...

  9. Android怎么改图标都不生效&&Android studio 如何修改APP图标和名字

    去这里(我自己写的),解决方法包你满意: https://blog.csdn.net/qq_43141611/article/details/101875545

  10. 【7.10校内test】T3经营与开发

    [题目链接luogu] 它……又是个DP 我……我讨厌DP!? 然后又是读入,显然用快读啊:(数据范围还是很大的)(习惯) 然后我们发现,不论是损耗值维修值,还是采矿所得,维修花费,都带着个p,因此我 ...