相关平台
支付宝小程序
复现仓库
git@github.com:dzhiqin/tarodemo.git
**小程序基础库: 1.25.8**
使用框架: React
复现步骤
初始化项目:
taro版本3.5.10,webpack5,
安装qrcode:
npm i --save qrcode
使用qrcode:
import QRCode from 'qrcode'
QRCode.toDataURL('I am a pony!')
.then(url => {
console.log(url)
})
.catch(err => {
console.error(err)
})
期望结果
能正常使用qrcode插件
实际结果
无法使用qrcode插件,报错内容:
TypeError: canvasEl.getContext is not a function
at Object.render (VM70 index.worker.js:11309:40)
at renderToDataURL (VM70 index.worker.js:11323:44)
at VM70 index.worker.js:11431:41
at new Promise ()
at renderCanvas (VM70 index.worker.js:11428:32)
at Index.componentDidMount (VM70 index.worker.js:2321:57)
at $g (VM70 index.worker.js:14941:87)
at Yg (VM70 index.worker.js:16645:106)
at Xg (VM70 index.worker.js:14925:25)
at Th (VM70 index.worker.js:15564:29)
环境信息
Taro CLI 3.5.10 environment info:
System:
OS: macOS 13.0.1
Shell: 5.8.1 - /bin/zsh
Binaries:
Node: 16.16.0 - ~/.nvm/versions/node/v16.16.0/bin/node
Yarn: 1.22.19 - /opt/homebrew/bin/yarn
npm: 8.11.0 - ~/.nvm/versions/node/v16.16.0/bin/npm
npmPackages:
@tarojs/cli: 3.5.10 => 3.5.10
@tarojs/components: 3.5.10 => 3.5.10
@tarojs/helper: 3.5.10 => 3.5.10
@tarojs/mini-runner: ^3.5.10 => 3.5.10
@tarojs/plugin-framework-react: 3.5.10 => 3.5.10
@tarojs/plugin-platform-alipay: 3.5.10 => 3.5.10
@tarojs/plugin-platform-jd: 3.5.10 => 3.5.10
@tarojs/plugin-platform-qq: 3.5.10 => 3.5.10
@tarojs/plugin-platform-swan: 3.5.10 => 3.5.10
@tarojs/plugin-platform-tt: 3.5.10 => 3.5.10
@tarojs/plugin-platform-weapp: 3.5.10 => 3.5.10
@tarojs/react: 3.5.10 => 3.5.10
@tarojs/router: 3.5.10 => 3.5.10
@tarojs/runtime: 3.5.10 => 3.5.10
@tarojs/shared: 3.5.10 => 3.5.10
@tarojs/taro: 3.5.10 => 3.5.10
@tarojs/taro-h5: 3.5.10 => 3.5.10
@tarojs/webpack5-runner: 3.5.10 => 3.5.10
babel-preset-taro: 3.5.10 => 3.5.10
eslint-config-taro: 3.5.10 => 3.5.10
react: ^18.0.0 => 18.2.0
npmGlobalPackages:
typescript: 4.8.4
补充信息
如果使用webpack4编译成weapp小程序,没问题;
但是webpack4编译成支付宝小程序,界面白屏;
用webpack5编译成支付宝小程序不会白屏,但是无法使用qrcode插件
3条答案
按热度按时间9q78igpj1#
@dzhiqin Webpack4 支付宝白屏是已知问题: #12984
qrcode
是小程序能使用的包吗?webpack5 + 微信小程序可以不?hfyxw5xn2#
@dzhiqin Webpack4 支付宝白屏是已知问题: #12984
qrcode
是小程序能使用的包吗?webpack5 + 微信小程序可以不?webpack5+微信小程序,也不支持qrcode。
只有webpack4编译可以使用qrcode,类似的插件还有mini-html-parser。
ia2d9nvy3#
https://github.com/Pudon/weapp-qrcode-base64 这个小程序可以直接用