npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

vue-weui

v0.3.2

Published

WeUI components with love of Vue.js

Downloads

74

Readme

vue-weui

npm package dependencies status npm downloads

使用Vue封装,为微信Web服务量身设计(Work with WeUI 0.4.0+)

特点

  • 使用Vue封装了WeUI的所有组件
  • 通过npm安装,可以一次引入所有组件,也可选择只引入需要的组件
  • 不带一行css,与WeUI样式完全解绑,可以方便地进行自定义

预览

qr-of-examples

扫描二维码在手机查看

或直接访问 http://adcentury.github.io/vue-weui

安装

安装weui

vue-weui中组件与css完全解绑,既给予了开发者自主性和灵活性,也能最大限度减少文件大小。安装css方法如下:

npm install --save weui

之后,只需在页面中引入dist/style/weui.css或者dist/style/weui.min.css其中之一即可. 例如:

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
  <title>Vue WeUI</title>
  <link rel="stylesheet" href="path/to/weui/dist/style/weui.min.css"/>
</head>

安装vue-weui

npm install vue-weui --save

使用

引用

ES6

// 引用所有组件
import VueWeui from 'vue-weui';

export default {
  components: VueWeui
};

// 引用部分组件
import {Dialog} from 'vue-weui';
// 或
// 只引用需要的文件,减少文件大小
import Dialog from 'vue-weui/components/dialog/dialog.vue';

export default {
  components: {
    Dialog
  }
};

CommonJS

var Dialog = require('vue-weui').Dialog;
// 或
var Dialog = require('vue-weui/components/dialog/dialog.vue');

new Vue({
  components: {
    'dialog': Dialog
  }
});

组件列表和使用说明

点击查看组件列表

查看示例

git clone https://github.com/adcentury/vue-weui
cd vue-weui && npm install
npm start

open http://localhost:8080 in browser

变更日志

点击查看变更日志

反馈

有任何意见和建议请提交issue或PR,谢谢。