文档章节

原生微信小程序脚手架(支持npm)

o
 osc_ogi0qclx
发布于 2019/08/24 18:55
字数 430
阅读 13
收藏 0

「深度学习福利」大神带你进阶工程师,立即查看>>>

微信小程序支持npm

为了支持生态扩展,社区贡献者可以提供更加丰富的功能,已经支持了第三方小程序开发功能,见如下地址。

 

微信小程序支持npm

https://developers.weixin.qq.com/miniprogram/dev/devtools/npm.html

从小程序基础库版本 2.2.1 或以上、及开发者工具 1.02.1808300 或以上开始,小程序支持使用 npm 安装第三方包。

此文档要求开发者们对 npm 有一定的了解,因此不会再去介绍 npm 的基本功能。如若之前未接触过 npm,请翻阅官方 npm 文档进行学习。

 

 

只要开发符合小程序的规范, 就可以通过npm安装并使用。

 

例如小程序IO接口库  flyio

https://www.npmjs.com/package/flyio

 

扩展组件见官方组件库:

https://github.com/wechat-miniprogram

例如:

https://github.com/wechat-miniprogram/recycle-view

使用方法

  1. 安装组件
npm install --save miniprogram-recycle-view
  1. 在页面的 json 配置文件中添加 recycle-view 和 recycle-item 自定义组件的配置

    {
      "usingComponents": {
        "recycle-view": "miniprogram-recycle-view/recycle-view", "recycle-item": "miniprogram-recycle-view/recycle-item" } }
  2. WXML 文件中引用 recycle-view

    <recycle-view batch="{{batchSetRecycleData}}" id="recycleId"> <view slot="before">长列表前面的内容</view> <recycle-item wx:for="{{recycleList}}" wx:key="id"> <view> <image style='width:80px;height:80px;float:left;' src="{{item.image_url}}"></image> {{item.idx+1}}. {{item.title}} </view> </recycle-item> <view slot="after">长列表后面的内容</view> </recycle-view>

 

 

脚手架推荐

为了方便开发者构建带npm的工程,开源社区有提供, 使用者也可以自行修改。gulp配置文件比较简单。

https://github.com/fanqingsong/wx-miniprogram-boilerplate

特性

  • 基于gulp+less构建的微信小程序工程项目
  • 项目图片自动压缩
  • ESLint代码检查
  • 使用命令行快速创建pagetemplatecomponent
  • 支持生产环境打包

 

o
粉丝 0
博文 500
码字总数 0
作品 0
私信 提问
加载中
请先登录后再评论。
在多个浏览器上运行脚本--Queen

假设你想和朋友们玩这么个游戏:你写下某个数字,然后让朋友们猜你写的是什么数字。你的朋友们将不断的给你一些猜测的数字,直到猜中为止。 现在想象你的朋友都是使用的浏览器,这个游戏就相...

匿名
2013/01/24
4.6K
1
Android-PanesLibrary

Android-PanesLibrary 可以让你非常轻松的创建原生的带多个面板的平板布局的 Android 应用。包括一个滑动菜单和内容面板,在平板上菜单和多个面板一起显示。 下图是用该组件开发的一个应用:...

匿名
2013/03/28
6.4K
0
libqt4json

libqt4jon 是一个使用 Qt QVariant 对象的 JSON 序列化和反序列化库。可系列化原生类型如 integer, double, QString, lists, maps, and QObject recursively. 只序列化通过 QObject Q_PROPER...

匿名
2013/03/29
384
0
OSX游戏模拟器--Open Emu

OpenEmu 是一项开源计划,目的是将游戏模拟带入OS X,使用Cocoa、Core Animation和Quartz等现代OS X技术,使用Sparkle进行自动升级。 Open Emu使用模块化构架,支持游戏引擎插件,这意味着O...

匿名
2013/04/10
1.6W
3
ThinkPHP助手

ThinkPHP助手 简介 ThinkPHP助手是运行在本地的ThinkPHP开发辅助性工具,也是本人的初学LAMP的学习成果,基于ThinkPHP+XML,前端采用jQuery和Bootstrap。主要目的是将应用开发过程中的一些繁琐...

朱__朱
2012/11/16
9.2K
2

没有更多内容

加载失败,请刷新页面

加载更多

SwaggerUI看烦了,IGeekFan.AspNetCore.Knife4jUI 帮你换个新皮肤

背景 好像是上周四,看到微信群有人说java有轮子swagger-bootstrap-ui,而c#,就是找不到。 于是我一看,就说大话:“这个只是一套UI,他这个有开源地址么” 被@at说:你试试... 当天晚上就把...

张善友
今天
0
0
字符串驻留是个什么鬼!

先看下面这段代码 >>> a = 'apple' >>> b = 'apple' >>> a is b True 返回结果看起来没毛病 再来看这段: >>> a = 'apple!' >>> b = 'apple!' >>> a is b False 这个结果是不是有点诡异 前后......

谭庆波
昨天
0
0
golang包的日常(2)——log包

普通使用 log包定义了Logger类型,该类型提供了一些格式化输出的方法。 log包中预定义了一个标准logger对象std,使我们可以直接调用函数来打印日志,默认是标准错误输出(Stderr),打印到终...

osc_dg21zk4i
13分钟前
0
0
近10年全国高校双青人才排名TOP50,苏州大学表现抢眼

转眼又到了每年的杰青和优青项目评选的日子,作为高校人才水平的重要评判标准,每年高校的自然科学基金项目数都是一个非常重要的指标。当然,由于杰青每年只有200个名额,而国内有3000多所高...

科研菌
昨天
0
0
意派Epub360丨从制作到推广,H5页面如何刷屏?

不是所有H5最终都可以引爆朋友圈,也不是所有未能刷屏的H5都不够优秀。如何找到爆点、如何制作实现、如何传播转化……每一个要点都可能是影响刷屏的关键。即使是再资深的营销专家,也很难在H...

牙牙乐牙牙乐
13分钟前
0
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部