如何在微信小程序中引用Rxjs
习惯了Rxjs以后,最近在开发微信小程序时也想在项目中应用它。但由于某些问题,微信小程序引用第三方包时,并不像普通的前台项目那么简单。经过一翻学习,实现了ts版本下的微信小程序成功引入Rxjs包,总结如下:
建立package.json
微信小程序在根目中有个package.json
,但这个package.json
只能添加一个开发依赖,即devDependencies
。而生产的依赖,比如我们当前需要在代码中使用Rxjs,则是不能够通过在package.json中添加的。
生产中需要安装依赖的话,需要在src
文件夹下建立(复制一个过来也行)package.json
,比如我们进入src
文件夹,执行npm init
,一通回车以后便会得到一个如下的package.json
"name": "root",
"version": "1.0.0",
"description": "",
"main": "app.js",
"directories": {
"example": "example"
},
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC"
}
有了此文件,便可以安装一些第三方依赖了。
wx-rxjs 【如何在微信小程序中引用Rxjs】由于未知的原因,Rxjs没有办法通过微信官方的构建工具构建成功的。在这里我们引入第三方的wx-rxjs,它的核心代码如下(你可以完全忽略它):
export { Operators };
export * from 'rxjs';
上述核心代码的作用就是重新进行exports,从而避免了一些操作符无法正确被微信小程序构建的问题。所以如果当前的 RXJS 版本不符合你的要求的话,则可以fork上面的仓库,修正rxjs版本后重新发布一个。
而最主要的操作是来到
src
目录下执行:npm install --save wx-rxjs
npm 构建 按官方文档找到微信开发者工具,依次点击:工具-》npm 构建,便完成了构建过程。
接下来更可以愉快地使用Rxjs了。
import { of, Observable, Operators } from 'wx-rxjs';
const o: Observable = of(1, 2, 3);
o.pipe(
Operators.map((x) => x + 1)
).subscribe((x) => console.log(x));
推荐阅读
- 任时光绽放成六月繁花
- 我从来不做坏事
- 考研英语阅读终极解决方案——阅读理解如何巧拿高分
- 樱花雨
- 如何寻找情感问答App的分析切入点
- 基于微信小程序带后端ssm接口小区物业管理平台设计
- 拍照一年啦,如果你想了解我,那就请先看看这篇文章
- mybatisplus如何在xml的连表查询中使用queryWrapper
- MybatisPlus使用queryWrapper如何实现复杂查询
- 人如果没梦想,和咸鱼有什么区别(自媒体时代把握住就能咸鱼翻身)