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
Vux的安装使用的更多相关文章
- 在vue中安装使用vux
最近因为的工作的原因在弄vue,从后端弄到前端之前一直用js,现在第一次接触vue感觉还挺有意思的,就是自己太菜了,这个脑子呀....不太够用.....页面设计用了一个叫vux的东西,vux可以提供一 ...
- vue项目中安装使用vux
vux是个vue的移动端框架. 目前移动端UI框架这么多,为啥选择vux呢?vux虽然说是个个人维护项目,但是有15000+个star,应该不比其他的团队开源框架差. 最重要的是,目前要做微信公众号和 ...
- vue移动端组件库vux使用小记
1.首先安装vux:npm install vux 2.安装vux-loader:npm install vux-loader 3.确认是否已安装less-loader:npm install ...
- vux 项目的构建
一:vux安装 # 安装vuxcnpm install vux --save # 安装vux-loadercnpm install vux-loader --save-dev # 安装less ...
- laravel5.5+vue+Element-ui+vux环境搭建(webpack+laravelMix)(转)
本教程例子可到GitHub 上下载 Laravel5.5-Vue-Element-ui-Vux 1.laravel5.5安装,详情请参考: https://laravelacademy.org/pos ...
- vux 入门备忘大佬多指点
一.安装node.js https://nodejs.org/en/ 这样就可以使用npm喽 二.安装vux 安装vux npm install vux --save 安装vux-loader npm ...
- vux用法
其实官网写的很详细了 但是好多时候没有仔细看的耐心 下面基本也是vux官网步骤: 很多人需要$t未定义问题 其实按着官网来就能解决这个报错: 如果你遇到 $t 报错问题,请不要开 issue,升级 v ...
- Mac OS X下安装Vue脚手架(vue-cli)
前言 Vue作为前端三大框架(Angular,React,Vue)之一,号称是最简单,最容易上手的框架,同时也是行内的大趋势,还可以用来开发最火的小程序.具有开发快,双向数据流等特点,有些人认为Vue ...
- vux+vuex+vue+Es6开发微信公众号的坑
初次开发微信公众号遇到很多问题,可能是基础不怎么牢靠,最近几天一直在看vue的东西,现在就来慢慢介绍vux和vue这个骚东西的用法: 细看文档一步步来, npm install vux --save ...
随机推荐
- 【web前端】面题整理(2)
今天是520,单身狗在这里祝各位520快乐! DOM节点统计 DOM 的体积过大会影响页面性能,假如你想在用户关闭页面时统计(计算并反馈给服务器)当前页面中元素节点的数量总和.元素节点的最大嵌套深度以 ...
- Java多线程学习——例子:模拟电影院抢座位
Cinema——List<Integer>数据结构存储电影院座位 public class Cinema{ private List<Integer> seats; //剩余座 ...
- python调用java所有代码都要放在jvm开启的时候调用,否则报错: No matching overloads found for in find. at native\common\jp_method.cpp:127
1.解决方法 开启java虚拟机 jvm 或者先执行结束在关闭java虚拟机jvm
- Android中Bitmap对象和字节流之间的相互转换(转)
android 将图片内容解析成字节数组:将字节数组转换为ImageView可调用的Bitmap对象:图片缩放:把字节数组保存为一个文件:把Bitmap转Byte import java.io.Buf ...
- 005 gcc 的简单使用
0. 前言 本文主要讲关于 gcc 的几种编译方式 不妨设文件名为 test.c 1. 方法一 $ gcc test.c (Windows OS)编译成功的话,没有回馈,在 test.c 所在的文件夹 ...
- Python3 AES加解密(AES/ECB/PKCS5Padding)
class AesEncry(object): key = "wwwwwwwwwwwwwwww" # aes秘钥 def encrypt(self, data): data = j ...
- 使用Object.create()实现继承 用 Object.create实现类式继承
使用Object.create()实现继承:https://www.cnblogs.com/cuew1987/p/4075027.html 用 Object.create实现类式继承:https:// ...
- CentOS 8 下 nginx 服务器安装及配置笔记
参考文档 nginx官方文档 安装 在CentOS下,nginx官方提供了安装包可以安装 首先先安装前置软件 sudo yum install yum-utils 然后将nginx官方源加入到yum源 ...
- Android怎么改图标都不生效&&Android studio 如何修改APP图标和名字
去这里(我自己写的),解决方法包你满意: https://blog.csdn.net/qq_43141611/article/details/101875545
- 【7.10校内test】T3经营与开发
[题目链接luogu] 它……又是个DP 我……我讨厌DP!? 然后又是读入,显然用快读啊:(数据范围还是很大的)(习惯) 然后我们发现,不论是损耗值维修值,还是采矿所得,维修花费,都带着个p,因此我 ...