小程序weui组件使用

1.在英文目录下。
git clone https://github.com/wechat-miniprogram/weui-miniprogram.git
cd weui-miniprogram
npm run init

上面可能有一些报错如下图,不过没影响,继续下面的npm install

npm install

npm run dev

之后看到如下

成功。

生成的 miniprogram_dev 目录是一个小程序项目目录。

之后用微信开发工具,导入项目,

选择

就可以了。

在自己项目中使用

现在变简单了,开发工具内置了这个库,

这里的路径直接写,就能调用,请放心。

更新最新的 nightly 版开发者工具
在app.json里新增
“useExtendedLib”: {
“weui”: true
}
在使用的页面json文件应用组件,比如在index.json里
{
“navigationStyle”:“custom”,
“usingComponents”: {
“mp-navigation-bar”:"weui-miniprogram/navigation-bar/navigation-bar"
}
}
wxml文件使用组件,比如在index.wxml里
<mp-navigation-bar title=“首页”></mp-navigation-bar>
备注:
文档里说目前暂不支持在分包中引用,但据代码测试,分包也能使用。
各位觉得有用的话,给个赞呗。
发布了96 篇原创文章 · 获赞 10 · 访问量 9万+

猜你喜欢

转载自blog.csdn.net/feifeiwuxian/article/details/103734519