1、快速搭建项目模板

因为项目使用vux,所以推荐使用vux官网的airyland/vux2 模板,vue-cli工具是vue项目的搭建脚手架

默认为 webpack2 模板,如果你需要使用webpack1,请使用 vue init airyland/vux2#webpack1 projectPath

vue init airyland/vux2 myfirst3

? Project name y
? Project description ceshi
? Author ymn
? Vue build standalone
? Install vue-router? Yes
? Use ESLint to lint your code? No
? Setup unit tests No
? Setup e2e tests with Nightwatch? No

vue-cli · Generated "myfirst3".

To get started:

cd myfirst3
npm install
npm run dev

Documentation can be found at https://vuejs-templates.github.io/webpack

 

2、运行模板文件

打开本地8080端口可以看到模板运行如下

注意:如包安装没有报错,npm run dev报错,很可能是8080端口冲突

3、安装 less

1
npm install less less-loader --save-dev

4.main.js  全局注册 toast  /  alert  /  loading

1
2
3
4
5
// 全局引入 loading/toast/alert
import { LoadingPlugin, ToastPlugin, AlertPlugin } from 'vux'
Vue.use(LoadingPlugin)
Vue.use(ToastPlugin)
Vue.use(AlertPlugin)

5.调用

1
2
3
4
5
6
7
8
9
// 显示等待框
this.$vux.loading.show({
  text: '加载中...'
});
 
// 隐藏等待框
setTimeout(() => {
  this.$vux.loading.hide()
}, 300);
1
2
3
4
5
6
// 提示信息
this.$vux.toast.show({
  type: 'text',
  position: 'middle',
  text: '请输入查询内容!'
});

.

Vux项目搭建的更多相关文章

  1. vue2.0 + vux 项目搭建

    1.快速搭建项目模板 因为项目使用vux,所以推荐使用vux官网的airyland/vux2 模板,vue-cli工具是vue项目的搭建脚手架 默认为 webpack2 模板,如果你需要使用webpa ...

  2. requirejs + vue 项目搭建

    以前都是支持 司徒正美 的,毕竟咱们也是跟着 司徒正美 一起走进了前端的世界.所以一般MVVM都是用avalon的,当然也是考虑到项目需要支持IE6,7,8的考虑.当然在用的时候也有一些小坑和bug, ...

  3. Intellij IDEA Java web 项目搭建

    Java web 项目搭建 简介 在上一节java web环境搭建中,我们配置了开发java web项目最基本的环境,现在我们将采用Spring MVC+Spring+Hibernate的架构搭建一个 ...

  4. 项目搭建系列之一:使用Maven搭建SpringMVC项目

    约定电脑都安装了eclipse,且已配置好Maven以及eclipse插件. 1.Eclipse 2.maven 3.Eclipse 需要安装maven插件.url:maven - http://do ...

  5. maven项目搭建

    一.Maven简介 Maven是基于Java平台的项目构建(mvn clean install).依赖管理(中央仓库,Nexus)和项目信息管理的项目管理工具. Maven是基于项目对象模型(POM) ...

  6. maven3常用命令、java项目搭建、web项目搭建详细图解

    http://blog.csdn.net/edward0830ly/article/details/8748986 ------------------------------maven3常用命令-- ...

  7. Java web 项目搭建

    Java web 项目搭建 简介 在上一节java web环境搭建中,我们配置了开发java web项目最基本的环境,现在我们将采用Spring MVC+Spring+Hibernate的架构搭建一个 ...

  8. requirejs + vue 项目搭建2

    上篇是年后的项目搭建的,时间比较仓促,感觉有点low 1.gulp-vue 文件对公用js的有依赖,以后别的同事拿去搭其他项目,估计会被喷 2.不支持vue-loader一样写模版语言和es6语法 最 ...

  9. Spirng+SpringMVC+Maven+Mybatis+MySQL项目搭建(转)

    这篇文章主要讲解使用eclipse对Spirng+SpringMVC+Maven+Mybatis+MySQL项目搭建过程,包括里面步骤和里面的配置文件如何配置等等都会详细说明. 如果还没有搭建好环境( ...

随机推荐

  1. 【Python】hasattr() getattr() setattr() 使用方法详解

    本文转自 https://www.cnblogs.com/cenyu/p/5713686.html hasattr(object, name)判断一个对象里面是否有name属性或者name方法,返回B ...

  2. Android手机上Audio DSP频率低 memory小的应对措施

    我在前面的文章(Android智能手机上的音频浅析)中说过Android手机上有一块专门用于音频处理的DSP,它的特点是频率低(一般几百MHZ).内部memory小(通常不超过100k word).要 ...

  3. ubuntu16.04 安装最新版nodejs

    ubuntu软件仓库中自带的nodejs版本过低 $ apt-cache policy nodejs nodejs: Installed: (none) Candidate: 4.2.6~dfsg-1 ...

  4. RE validator

    package com.office.utility;   import java.util.regex.Pattern;   /**  * 校验器:利用正则表达式校验邮箱.手机号等  *  * @a ...

  5. Windows和Linux查看端口占用

    Windows方法 TCP netstat -aon|findstr "TCP"|findstr "LISTENING"|findstr ":135[ ...

  6. centos6.5部署redmine3.2

    ruby 2.1 + rails 4.2+ mysql 5.6 +centos6.5 + rvm 1.29 1.基本的软件环境 yum -y install libyaml-devel zlib-de ...

  7. ios unicode

    转义字符,反斜扛\ \u 后跟4位16进制数 \U 后跟8位16进制数

  8. 【FZSZ2017暑假提高组Day1】最大矩形

    [问题描述] 现在有n个宽度为1的矩形按如下图(左边的)所示的方式排在了一起: 用肉眼容易看出,在左图内部面积最大的矩形如右图绿色部分所标注. 现在我们考虑将其中一些宽度为1的矩形取出,按照原顺序再次 ...

  9. Adjacent Bit Counts(01组合数)

    Adjacent Bit Counts 4557 Adjacent Bit CountsFor a string of n bits x 1 , x 2 , x 3 ,..., x n , the a ...

  10. 基于windows平台搭建elasticsearch

    部署准备 elasticsearch-6.0.1.zip--https://www.elastic.co/downloads/elasticsearch elasticsearch-head-mast ...