weui 使用教程及问题解决方法

导读:本篇文章讲解 weui 使用教程及问题解决方法,希望对大家有帮助,欢迎收藏,转发!站点地址:www.bmabk.com

WeUI 是由微信官方设计团队专为微信移动 Web 应用设计的 UI 库。

WeUI 是一套同微信原生视觉体验一致的基础样式库,为微信 Web 开发量身设计,可以令用户的使用感知更加统一。包含button、cell、dialog、toast、article、icon等各式元素。

使用

方法一:
使用bower进行安装

 

bower install –save weui

方法二:
使用npm进行安装

npm install –save weui

开发

git clone GitHub – Tencent/weui: A UI library by WeChat official design team, includes the most useful widgets/modules in mobile web applications.
cd weui
npm install -g gulp
npm install
gulp -ws

运行gulp -ws命令,会监听src目录下所有文件的变更,并且默认会在8080端口启动服务器,然后在浏览器打开http://localhost:8080/example

手机预览

请用微信扫码

weui-demo.png

WeUI

注意:

如果你的node.js版本为10以上,在执行 gulp -ws 的时候可能会出现这个错误:

primordials is not defined

所以通过nvm降低node.js版本,

nvm下载地址:Releases · coreybutler/nvm-windows · GitHub

这个为安装版

weui 使用教程及问题解决方法

下载之后安装nvm

nvm安装之后还需要配置两个环境变量(NVM_HOME,NVM_SYMLINK) 。安装包应该会自动写入环境变量,可以忽略.

安装完成后打开命令栏, 输入 nvm version命令, 如果成功打印版本号,说明你已经安装成功了

weui 使用教程及问题解决方法

 nvm list 查看你的node版本列表,带*号为你当前选中版本 

weui 使用教程及问题解决方法

nvm list availabe 查看可下载的node版本

weui 使用教程及问题解决方法

nvm install 10.15.0 下载你想要的版本

weui 使用教程及问题解决方法

nvm use 10.15.0  切换版本

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

文章由极客之音整理,本文链接:https://www.bmabk.com/index.php/post/71419.html

(0)
小半的头像小半

相关推荐

极客之音——专业性很强的中文编程技术网站,欢迎收藏到浏览器,订阅我们!