《智能前端技术与实践》——第1章 开发环境配置——1.7 使用微信开发者工具——1.7.2 使用微信小程序插件(下)

简介: 《智能前端技术与实践》——第1章 开发环境配置——1.7 使用微信开发者工具——1.7.2 使用微信小程序插件(下)

《智能前端技术与实践》——第1章 开发环境配置——1.7 使用微信开发者工具——1.7.2 使用微信小程序插件(上) https://developer.aliyun.com/article/1228395?groupCode=tech_library


3)通过代码引入相关包

我们需要通过代码将所安装的npm包导入所创建的项目中,请看操作具体步骤。 使用插件前,我们要在app.json中声明需要使用的插件,如代码清单1-35所示。


image.png



代码清单 1-35


{
..."plugins": {
"tfjsPlugin": {
"version": "0.0.6",
"provider": "wx6afed118d9e81df9"}
}
...}


4)在 app.js 的 onLaunch()里调用 configPlugin()函数


首先,我们对 app.js 文件的内容做一下修改,如图 1-60 所示。

image.png

然后,在 APP()函数外部添加代码,如代码清单 1-36 所示。


代码清单 1-36


varfetchWechat=require('fetch-wechat'); 
vartf=require('@tensorflow/tfjs-core'); 
varwebgl=require('@tensorflow/tfjs-backend-webgl'); 
varplugin=requirePlugin('tfjsPlugin');

最后,在App()函数内部的onLaunch()方法中加入代码,以调用插件函数,如代码清单1-37

所示。

代码清单1-37

plugin.configPlugin({ 
fetchFunc: fetchWechat.fetchFunc(), 
tf,webgl,canvas: wx.createOffscreenCanvas() 
   });

设置完组件后,我们就可以使用TensorFlow.js库的API了。我们写一段测试代码验证一

下该组件是否可以正常调用,如代码清单1-38所示。

代码清单1-38

varfetchWechat=require('fetch-wechat');
vartf=require('@tensorflow/tfjs-core');
varwebgl=require('@tensorflow/tfjs-backend-webgl');
varplugin=requirePlugin('tfjsPlugin');
App({
onLaunch() {
plugin.configPlugin({
fetchFunc: fetchWechat.fetchFunc(),
tf, webgl, canvas: wx.createOffscreenCanvas()
    });
tf.tensor([1, 2, 3, 4]).print()
  }
})

我们看到代码清单 1-38 中所定义的张量可以正常显示在控制台,运行结果如图 1-61 所示。


image.png

张量显示成功表明,TensorFlowJS 组件可以正常调用。

相关文章
|
9月前
|
前端开发 搜索推荐 开发工具
通义灵码与颜色板生成器,为前端开发提供智能配色解决方案
在前端开发中,色彩搭配对用户体验和界面美观至关重要。通义灵码提供的颜色板生成器通过自动推荐配色方案、随机生成颜色组合及支持自定义调整,帮助开发者高效完成配色任务。该工具支持一键导出为 CSS 样式表,并提供简洁的中文指令交互方式,大大提升开发效率,助力开发者打造美观和谐的用户界面。
|
7月前
|
人工智能 前端开发 JavaScript
前端工程化演进之路:从手工作坊到AI驱动的智能化开发
前端工程化演进之路:从手工作坊到AI驱动的智能化开发
886 18
前端工程化演进之路:从手工作坊到AI驱动的智能化开发
|
10月前
|
JSON 安全 定位技术
微信附近人提取v3脚本, 微信附近人id提取技术插件,采集附近人wxid数据工具
本内容介绍微信“附近的人”功能的技术原理与实现方法,基于LBS服务,涉及位置模拟、协议分析及数据解析。通过修改GPS坐标或使用Frida等工具hook位置函数
|
10月前
微信封号脚本插件,全自动批量投诉工具, vx隔空抓包封号思路【仅供学习参考用途】
这是一款针对微信投诉自动化处理的工具插件,通过模拟点击操作实现批量投诉功能。相比手动投诉,该插件效率更高、成功率更有保障。
|
资源调度 JavaScript 前端开发
前端开发必备!Node.js 18.x LTS保姆级安装教程(附国内镜像源配置)
本文详细介绍了Node.js的安装与配置流程,涵盖环境准备、版本选择(推荐LTS版v18.x)、安装步骤(路径设置、组件选择)、环境验证(命令测试、镜像加速)及常见问题解决方法。同时推荐开发工具链,如VS Code、Yarn等,并提供常用全局包安装指南,帮助开发者快速搭建高效稳定的JavaScript开发环境。内容基于官方正版软件,确保合规性与安全性。
12636 23
|
缓存 前端开发 Android开发
【04】flutter补打包流程的签名过程-APP安卓调试配置-结构化项目目录-完善注册相关页面-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程
【04】flutter补打包流程的签名过程-APP安卓调试配置-结构化项目目录-完善注册相关页面-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程
652 12
【04】flutter补打包流程的签名过程-APP安卓调试配置-结构化项目目录-完善注册相关页面-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程
|
JSON 小程序 JavaScript
uni-app开发微信小程序的报错[渲染层错误]排查及解决
uni-app开发微信小程序的报错[渲染层错误]排查及解决
3869 7
|
小程序 JavaScript 前端开发
uni-app开发微信小程序:四大解决方案,轻松应对主包与vendor.js过大打包难题
uni-app开发微信小程序:四大解决方案,轻松应对主包与vendor.js过大打包难题
4279 1
|
人工智能 自然语言处理 小程序
技术小白如何利用DeepSeek半小时开发微信小程序?
通过通义灵码的“AI程序员”功能,即使没有编程基础也能轻松创建小程序或网页。借助DeepSeek V3和R1满血版模型,用户只需用自然语言描述需求,就能自动生成代码并优化程序。例如,一个文科生仅通过描述需求就成功开发了一款记录日常活动的微信小程序。此外,通义灵码还提供智能问答模式,帮助用户解决开发中的各种问题,极大简化了开发流程,让普通人的开发体验更加顺畅。
3605 11
技术小白如何利用DeepSeek半小时开发微信小程序?