mpvue搭配iView开发小程序

一起进步,一起共勉~

初始化mpvue项目

需提前安装好node跟npm,请自行google安装

# 全局安装 vue-cli
$ npm install --global vue-cli

# 创建一个基于 mpvue-quickstart 模板的新项目
$ vue init mpvue/mpvue-quickstart my-project

# 安装依赖
$ cd my-project
$ npm install
# 启动构建
$ npm run dev

接下来启动微信开发者工具,引入项目即可预览到 mpvue 小程序!

使用 iView 组件库

1、下载iView

这里下载iview-weapp项目

2、配置iView

将iview-weapp中的dist文件夹(此处我重命名为iview,以便区分)复制到mpvue项目的输出目录中(默认是dist,编译后的vue代码在此)

3、使用iView

比如,现在我要在src/pages/index/index.vue中使用iView中的i-button组件,那么就先要在src/pages/index/main.json(如果没有该文件,则新建一个)中进行如下配置:

{
    "usingComponents": {
      "i-button": "../../iview/button/index"
    }
}

经过上一步的配置,我们就可以开始在src/pages/index/index.vue中使用这个i-button组件了,就像这样:

<template>
  <div class="container">
    <i-button type="primary" @click="bindViewTap">这是一个按钮</i-button>
  </div>
</template>

运行这个小程序,能看到如下的样子:

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏云计算教程系列

如何在Ubuntu 14.04上安装Nagios 4并监控服务器

在本教程中,我们将介绍在Ubuntu 14.04上安装非常流行的开源监控系统Nagios 4。我们将介绍一些基本配置,以便您可以通过Web界面监控主机资源。我们...

13200
来自专栏F-Stack的专栏

如何在腾讯云主机上快速部署 F-Stack HTTP 服务

F-Stack是一个全用户态的高性能的网络接入开发包,本文介绍如何在腾讯云主机上使用F-Stack快速部署HTTP服务器。

1.4K00
来自专栏哎_小羊

SonarQube 之 gitlab-plugin 配合 gitlab-ci 完成每次 commit 代码检测

目录 背景介绍 环境、软件准备 Sonar GitLab Plugin 安装 配置使用说明 1、背景介绍 我们知道使用 SonarQube 可以在日常开发中检...

2.4K90
来自专栏云计算

6个虚拟机备份和恢复的最佳实践

虚拟机的架构与传统的物理机有着天壤之别,因此不适合于传统的备份方案。在本文中,我们将介绍一些虚拟机备份的最佳实践。

232100
来自专栏用户2442861的专栏

PyCharm python 入门实例 Hello world!

http://blog.csdn.net/chenggong2dm/article/details/9366805

50510
来自专栏上善若水

022-github 从fork的原代码更新repo

玩过github的人一定会在你自己的账号上fork了一些github开源项目。这些开源项目往往更新比较活跃,你今天fork用到你自己的项目中去了,过几个星期这个...

14740
来自专栏Java技术栈

史上最全Redis面试题及答案。

花了大量时间 整理了这套Redis面试题 首发50题,绝无仅有 从入门到精通 从基础,高级知识点 再到集群,运维,方案… 弄明白了这些题 可以说可以成为面霸了 ...

76470
来自专栏Angular&服务

检测js错误

-在 app.module.ts 中配置 FundebugErrorHandler

9030
来自专栏性能与架构

监控工具 Nagios

监控的本质就是收集获取软硬件资源的状态信息,例如 CPU 的使用率、内存空间、磁盘余量、WEB服务可达状态……,然后分析各部分是否工作正常,当发现某个地方异常时...

40640
来自专栏JMCui

window 服务器的Tomcat 控制台日志保存到日志文件.

    在Linux系统中,Tomcat 启动后默认将很多信息都写入到 catalina.out 文件中,我们可以通过tail  -f  catalina.ou...

517100

扫码关注云+社区

领取腾讯云代金券