uniapp中在web端如何友好的展示app当前的版本等信息

一个小技巧,分享下在webapp中友好展示当前app信息的方法

实现效果

代码实现

  • 导入
js 复制代码
	import {
		version,
		name
	} from './package.json'
  • 应用声明周期中处理
js 复制代码
onLaunch: function() {
// #ifdef H5
	console.log(
		`%c hello uniapp %c v${version} `,
		'background:#35495e ; padding: 1px; border-radius: 3px 0 0 3px;  color: #fff',
		'background:#007aff ;padding: 1px; border-radius: 0 3px 3px 0;  color: #fff; font-weight: bold;'
	)
	console.log(`%c hello uniapp %c v${name} `,
		'background:#35495e ; padding: 1px; border-radius: 3px 0 0 3px;  color: #fff',
		'background:#5500ff ;padding: 1px; border-radius: 0 3px 3px 0;  color: #fff; font-weight: bold;')
// #endif
}

可以根据自己的实际需要,完善需要展示的信息,配色,内容。

相关推荐
dolt027 分钟前
基于deepseek实现的ai问答小程序
前端·开源
一只小bit20 分钟前
Qt 快速开始:安装配置并创建简单标签展示
开发语言·前端·c++·qt·cpp
加蓓努力我先飞25 分钟前
a-第一部分-基础篇-前端面试题总结
前端
青莲84329 分钟前
Android Jetpack - 3 LiveData
android·前端
狗哥哥38 分钟前
企业级 Vue 3 基础数据管理方案:从混乱到统一
前端
前端涂涂1 小时前
哈希指针,什么是区块链,genesis blcok,most recent block,tamper-evident log,merkle tree,binar
前端
尽兴-1 小时前
问题记录:数据库字段 `CHAR(n)` 导致前端返回值带空格的排查与修复
前端·数据库·mysql·oracle·达梦·varchar·char
DsirNg1 小时前
Vue 3:我在真实项目中如何用事件委托
前端·javascript·vue.js
克喵的水银蛇1 小时前
Flutter 适配实战:屏幕适配 + 暗黑模式 + 多语言
前端·javascript·flutter
刻刻帝的海角1 小时前
基于UniApp与Vue3语法糖的实时任务管理应用开发实践
uni-app