共计 27866 个字符，预计需要花费 70 分钟才能阅读完成。
导语：最近开发了一个基于 uniapp 框架的我的项目，有一些感触和领会，所以想记录以下一些技术和教训，在这里做一个系列总结，算是对本人做一个交代吧。
目录
- 简介
- 全局文件
- 全局组件
- 罕用 API
- 条件编译
- 插件开发
简介
uniapp 是 DCloud 公司于 2015 年开发的一款基于 vue 的跨端框架，编写一套代码就能够运行到 web、小程序（各种小程序）和 app（Android 和 iOS）端，使得开发一个我的项目的老本很小，效率很高，方便快捷。
uniapp 官网
性能框架图
各端运行成果
全局文件
这里次要是两个文件：pages.json治理页面路由、和 manifest.json 治理利用配置。
pages.json
pages.json 文件是进行全局配置，包含页面文件门路、款式、原生导航栏等内容。
以下是官网给出的配置示例：
{
"pages": [
{
"path": "pages/component/index",
"style": {"navigationBarTitleText": "组件"}
},
{
"path": "pages/API/index",
"style": {"navigationBarTitleText": "接口"}
},
{
"path": "pages/component/view/index",
"style": {"navigationBarTitleText": "view"}
}
],
"condition": {
// 模式配置，仅开发期间失效
"current": 0, // 以后激活的模式（list 的索引项）"list": [
{
"name": "test", // 模式名称
"path": "pages/component/view/index" // 启动页面，必选
}
]
},
"globalStyle": {
"navigationBarTextStyle": "black",
"navigationBarTitleText": "演示",
"navigationBarBackgroundColor": "#F8F8F8",
"backgroundColor": "#F8F8F8",
"usingComponents": {"collapse-tree-item": "/components/collapse-tree-item"},
"renderingMode": "seperated", // 仅微信小程序，webrtc 无奈失常时尝试强制敞开同层渲染
"pageOrientation": "portrait", // 横屏配置，全局屏幕旋转设置(仅 APP/ 微信 /QQ 小程序)，反对 auto / portrait / landscape
"rpxCalcMaxDeviceWidth": 960,
"rpxCalcBaseDeviceWidth": 375,
"rpxCalcIncludeWidth": 750
},
"tabBar": {
"color": "#7A7E83",
"selectedColor": "#3cc51f",
"borderStyle": "black",
"backgroundColor": "#ffffff",
"height": "50px",
"fontSize": "10px",
"iconWidth": "24px",
"spacing": "3px",
"iconfontSrc": "static/iconfont.ttf", // app tabbar 字体.ttf 文件门路 app 3.4.4+
"list": [
{
"pagePath": "pages/component/index",
"iconPath": "static/image/icon_component.png",
"selectedIconPath": "static/image/icon_component_HL.png",
"text": "组件",
"iconfont": {
// 优先级高于 iconPath，该属性依赖 tabbar 根节点的 iconfontSrc
"text": "\ue102",
"selectedText": "\ue103",
"fontSize": "17px",
"color": "#000000",
"selectedColor": "#0000ff"
}
},
{
"pagePath": "pages/API/index",
"iconPath": "static/image/icon_API.png",
"selectedIconPath": "static/image/icon_API_HL.png",
"text": "接口"
}
],
"midButton": {
"width": "80px",
"height": "50px",
"text": "文字",
"iconPath": "static/image/midButton_iconPath.png",
"iconWidth": "24px",
"backgroundImage": "static/image/midButton_backgroundImage.png"
}
},
"easycom": {
"autoscan": true, // 是否主动扫描组件
"custom": {
// 自定义扫描规定
"^uni-(.*)": "@/components/uni-$1.vue"
}
},
"topWindow": {
"path": "responsive/top-window.vue",
"style": {"height": "44px"}
},
"leftWindow": {
"path": "responsive/left-window.vue",
"style": {"width": "300px"}
},
"rightWindow": {
"path": "responsive/right-window.vue",
"style": {"width": "300px"},
"matchMedia": {"minWidth": 768}
}
}- manifest.json
manifest.json 文件是利用的配置文件，用于指定利用的名称、图标、权限等内容。
以下是官网给出的配置示例：
{
"appid": "__UNI__XXXXXX，创立利用时云端调配的，不要批改。",
"name": "利用名称，如 uni-app",
"description": "利用形容",
"versionName": "1.0.0",
"versionCode": "100",
"uniStatistics": {"enable": false},
"app-plus": {
"allowsInlineMediaPlayback": true, // 可选，Boolean 类型, 是否容许 h5 中视频非全屏播放，3.8.5 版本开始默认值为 true（仅 iOS 失效）"mediaPlaybackRequiresUserAction": false, // 可选，Boolean 类型, 可通过此属性配置 h5 中的音视频是否可通过 API 自动播放，留神当设置为 false 时容许 API 管制自动播放，3.8.5 版本开始默认值为 false（仅 iOS 失效 3.0.1 + 版本反对）"nvueCompiler": "weex", // 可选，字符串类型，nvue 页面编译模式，可取值 uni-app、weex，参考：https://ask.dcloud.net.cn/article/36074
"nvueStyleCompiler": "weex", // 可选，字符串类型，nvue 页面款式编译模式，可取值 uni-app、weex，参考：https://ask.dcloud.net.cn/article/38751
"renderer": "native", // 可选，字符串类型，可不加载基于 webview 的运行框架，可取值 native
"compilerVersion": 2, // 可选，数字类型，编译器版本，可取值 2、3，参考：https://ask.dcloud.net.cn/article/36599
"nvueLaunchMode": "normal", // 可选，字符串类型，nvue 首页启动模式，compilerVersion 值为 3 时失效，可取值 normal、fast，参考：https://ask.dcloud.net.cn/article/36749
"nvue": {
// 可选，JSON 对象，nvue 页面相干配置
"flex-direction": "row" // 可选，字符串类型，nvue 页面的 flex-direction 默认值，可取值 row、row-reverse、column、column-reverse
},
"optimization": {
// 可选，JSON 对象，分包配置
"subPackages": true // 可选，Boolean 类型，是否开启分包优化，参考：https://uniapp.dcloud.io/collocation/pages.html#subpackages
},
"uniStatistics": {
// 可选，JSON 对象，uni 统计配置
"enable": true // 可选，Boolean 类型，是否开启 uni 统计
},
"screenOrientation": [
// 可选，字符串数组类型，利用反对的横竖屏
"portrait-primary", // 可选，字符串类型，反对竖屏
"portrait-secondary", // 可选，字符串类型，反对反向竖屏
"landscape-primary", // 可选，字符串类型，反对横屏
"landscape-secondary" // 可选，字符串类型，反对反向横屏
],
"splashscreen": {
// 可选，JSON 对象，splash 界面配置
"alwaysShowBeforeRender": true, // 可选，Boolean 类型，是否期待首页渲染结束后再敞开启动界面
"autoclose": true, // 可选，Boolean 类型，是否主动敞开启动界面
"waiting": true, // 可选，Boolean 类型，是否在程序启动界面显示期待雪花
"event": "loaded", // 可选，字符串类型，可取值 titleUpdate、rendering、loaded，uni-app 我的项目已废除
"target": "defalt", // 可选，字符串类型，可取值 default、second，uni-app 我的项目已废除
"dealy": 0, // 可选，数字类型，提早主动敞开启动工夫，单位为毫秒，uni-app 我的项目已废除
"ads": {
// 可选，JSON 对象，开屏广告配置
"backaground": "#RRGGBB", // 可选，字符串类型，格局为 #RRGGBB，开屏广告背景色彩
"image": "" // 可选，字符串类型，底部图片地址，绝对利用资源目录门路
},
"androidTranslucent": false // 可选，Boolean 类型，应用“自定义启动图”启动界面时是否显示通明过渡界面，可解决点击桌面图标延时启动利用的成果
},
"modules": {
// 可选，JSON 对象，应用的模块
"Bluetooth": {// 可选，JSON 对象，Bluetooth(低功耗蓝牙)
"description": "低功耗蓝牙"
},
"Contacts": {// 可选，JSON 对象，Contact(通讯录)
"description": "通讯录"
},
"FaceID": {// 可选，JSON 对象，FaceID(人脸识别)，仅 iOS 反对
"description": "人脸识别"
},
"Fingerprint": {// 可选，JSON 对象，Fingerprint(指纹识别)
"description": "指纹识别"
},
"Geolocation": {// 可选，JSON 对象，Geolocation(定位)
"description": "定位"
},
"iBeacon": {
// 可选，JSON 对象，iBeacon
"description": "iBeacon"
},
"LivePusher": {// 可选，JSON 对象，LivePusher(直播推流)
"description": "直播推流"
},
"Maps": {// 可选，JSON 对象，Maps(地图)
"description": "地图"
},
"Messaging": {// 可选，JSON 对象，Messaging(短彩邮件音讯)
"description": "短彩邮件音讯"
},
"OAuth": {// 可选，JSON 对象，OAuth(登录鉴权)
"description": "登录鉴权"
},
"Payment": {// 可选，JSON 对象，Payment(领取)
"description": "iBeacon"
},
"Push": {// 可选，JSON 对象，Push(音讯推送)
"description": "iBeacon"
},
"Share": {// 可选，JSON 对象，Share(分享)
"description": "iBeacon"
},
"Speech": {// 可选，JSON 对象，Speech(语音输入)
"description": "iBeacon"
},
"Statistic": {// 可选，JSON 对象，Statistic(统计)
"description": "iBeacon"
},
"SQLite": {// 可选，JSON 对象，SQLite(统计)
"description": "iBeacon"
},
"VideoPlayer": {// 可选，JSON 对象，VideoPlayer(视频播放)
"description": "iBeacon"
},
"Webview-x5": {// 可选，JSON 对象，Android X5 Webview(腾讯 TBS)，仅 Android 反对
"description": "iBeacon"
},
"UIWebview": {
// 可选，JSON 对象，UIWebview，仅 iOS 反对
"description": "iBeacon"
}
},
"webView": {
// 3.5.0 + 当零碎 webview 低于指定版本时，会弹出提醒。或者下载 x5 内核后持续启动，仅 Android 反对
"minUserAgentVersion": "95.0.4638.75", // 最小 webview 版本
"x5": {
// 此属性须要勾选 Android X5 Webview 模块，具体参见上面的阐明
"timeOut": 3000, // 超时工夫
"showTipsWithoutWifi": true, // 是否在非 WiFi 网络环境时，显示用户确认下载 x5 内核的弹窗。"allowDownloadWithoutWiFi": false // 是否容许用户在非 WiFi 网络时进行 x5 内核的下载。（如果为 true，就不会显示用户确认的弹窗。）}
},
"checkPermissionDenied": false, // 是否校验已回绝权限 如果回绝则不会再申请 默认 false 不校验已回绝权限
"distribute": {
// 必选，JSON 对象，云端打包配置
"android": {
// 可选，JSON 对象，Android 平台云端打包配置
"packagename": "", // 必填，字符串类型，Android 包名"keystore":"", // 必填，字符串类型，Android 签名证书文件门路
"password": "", // 必填，字符串类型，Android 签名证书文件的明码"aliasname":"", // 必填，字符串类型，Android 签名证书别名
"schemes": "", // 可选，字符串类型，参考：https://uniapp.dcloud.io/tutorial/app-android-schemes"abiFilters": [
// 可选，字符串数组类型，参考：https://uniapp.dcloud.io/tutorial/app-android-abifilters
"armeabi-v7a",
"arm64-v8a",
"x86",
"x86_64"
],
"permissions": [
// 可选，字符串数组类型，Android 权限配置
"<uses-feature android:name=\"android.hardware.camera\"/>"
],
"custompermissions": false, // 可选，Boolean 类型，是否自定义 Android 权限配置
"permissionExternalStorage": {
// 可选，JSON 对象，Android 平台利用启动时申请读写手机存储权限策略
"request": "always", // 必填，字符串类型，申请读写手机存储权限策略，可取值 none、once、always
"prompt": "" // 可选，字符串类型，当 request 设置为 always 值用户回绝时弹出提示框上的内容
},
"permissionPhoneState": {
// 可选，JSON 对象，Android 平台利用启动时申请读取设施信息权限配置
"request": "always", // 必填，字符串类型，申请读取设施信息权限策略，可取值 none、once、always
"prompt": "" // 可选，字符串类型，当 request 设置为 always 值用户回绝时弹出提示框上的内容
},
"minSdkVersion": 21, // 可选，数字类型，Android 平台最低反对版本，参考：https://uniapp.dcloud.io/tutorial/app-android-minsdkversion
"targetSdkVersion": 30, // 可选，数字类型，Android 平台指标版本，参考：https://uniapp.dcloud.io/tutorial/app-android-targetsdkversion
"packagingOptions": [
// 可选，字符串数组类型，Android 平台云端打包时 build.gradle 的 packagingOptions 配置项
"doNotStrip'*/armeabi-v7a/*.so'","merge '**/LICENSE.txt'"
],
"jsEngine": "v8", // 可选，字符串类型，uni-app 应用的 JS 引擎，可取值 v8、jsc
"debuggable": false, // 可选，Boolean 类型，是否开启 Android 调试开关
"locale": "default", // 可选，利用的语言
"forceDarkAllowed": false, // 可选，Boolean 类型，是否强制容许暗黑模式
"resizeableActivity": false, // 可选，Boolean 类型，是否反对分屏调整窗口大小
"hasTaskAffinity": false, // 可选，Boolean 类型，是否设置 android：taskAffinity
"buildFeatures": {
//（HBuilderX3.5.0+ 版本反对）可选，JSON 对象，Android 平台云端打包时 build.gradle 的 buildFeatures 配置项
"dataBinding": false, // 可选，Boolean 类型，是否设置 dataBinding
"viewBinding": false // 可选，Boolean 类型，是否设置 viewBinding
}
},
"ios": {
// 可选，JSON 对象，iOS 平台云端打包配置
"appid": "", // 必填，字符串类型，iOS 平台 Bundle ID"mobileprovision":"", // 必填，字符串类型，iOS 打包应用的 profile 文件门路
"p12": "", // 必填，字符串类型，iOS 打包应用的证书文件门路"password":"", // 必填，字符串类型，iOS 打包应用的证书明码
"devices": "iphone", // 必填，字符串类型，iOS 反对的设施类型，可取值 iphone、ipad、universal
"urlschemewhitelist": "baidumap", // 可选，字符串类型，利用拜访白名单列表，参考：https://uniapp.dcloud.io/tutorial/app-ios-schemewhitelist
"urltypes": "", // 可选，字符串类型，参考：https://uniapp.dcloud.io/tutorial/app-ios-schemes"UIBackgroundModes":"audio", // 可选，字符串类型，利用后盾运行模式，参考：https://uniapp.dcloud.io/tutorial/app-ios-uibackgroundmodes"frameworks": [
// 可选，字符串数组类型，依赖的零碎库，已废除，举荐应用 uni 原生插件扩大应用零碎依赖库
"CoreLocation.framework"
],
"deploymentTarget": "10.0", // 可选，字符串类型，iOS 反对的最低版本
"privacyDescription": {
// 可选，JSON 对象，iOS 隐衷信息拜访的许可形容
"NSPhotoLibraryUsageDescription": "", // 可选，字符串类型，零碎相册读取权限形容"NSPhotoLibraryAddUsageDescription":"", // 可选，字符串类型，零碎相册写入权限形容
"NSCameraUsageDescription": "", // 可选，字符串类型，摄像头应用权限形容"NSMicrophoneUsageDescription":"", // 可选，字符串类型，麦克风应用权限形容
"NSLocationWhenInUseUsageDescription": "", // 可选，字符串类型，运行期拜访地位权限形容"NSLocationAlwaysUsageDescription":"", // 可选，字符串类型，后盾运行拜访地位权限形容
"NSLocationAlwaysAndWhenInUseUsageDescription": "", // 可选，字符串类型，运行期后后盾拜访地位权限形容"NSCalendarsUsageDescription":"", // 可选，字符串类型，应用日历权限形容
"NSContactsUsageDescription": "", // 可选，字符串类型，应用通讯录权限形容"NSBluetoothPeripheralUsageDescription":"", // 可选，字符串类型，应用蓝牙权限形容
"NSBluetoothAlwaysUsageDescription": "", // 可选，字符串类型，后盾应用蓝牙权限形容"NSSpeechRecognitionUsageDescription":"", // 可选，字符串类型，零碎语音辨认权限形容
"NSRemindersUsageDescription": "", // 可选，字符串类型，零碎揭示事项权限形容"NSMotionUsageDescription":"", // 可选，字符串类型，应用静止与衰弱权限形容
"NSHealthUpdateUsageDescription": "", // 可选，字符串类型，应用衰弱更新权限形容"NSHealthShareUsageDescription":"", // 可选，字符串类型，应用衰弱分享权限形容
"NSAppleMusicUsageDescription": "", // 可选，字符串类型，应用媒体资料库权限形容"NFCReaderUsageDescription":"", // 可选，字符串类型，应用 NFC 权限形容
"NSHealthClinicalHealthRecordsShareUsageDescription": "", // 可选，字符串类型，拜访临床记录权限形容"NSHomeKitUsageDescription":"", // 可选，字符串类型，拜访 HomeKit 权限形容
"NSSiriUsageDescription": "", // 可选，字符串类型，拜访 Siri 权限形容"NSFaceIDUsageDescription":"", // 可选，字符串类型，应用 FaceID 权限形容
"NSLocalNetworkUsageDescription": "", // 可选，字符串类型，拜访本地网络权限形容"NSUserTrackingUsageDescription":"" // 可选，字符串类型，跟踪用户流动权限形容
},
"idfa": true, // 可选，Boolean 类型，是否应用广告标识
"capabilities": {// 可选，JSON 对象，利用的能力配置（Capabilities）},
"CFBundleName": "HBuilder", // 可选，字符串类型，CFBundleName 名称
"validArchitectures": [
// 可选，字符串数组类型，编译时反对的 CPU 指令，可取值 arm64、arm64e、armv7、armv7s、x86_64
"arm64"
],
"pushRegisterMode": "manual", // 可选，应用“Push(音讯推送)”模块时申请零碎推送权限模式，manual 示意调用 push 相干 API 时申请，其它值示意利用启动时主动申请
"privacyRegisterMode": "manual" // 可选，仅 iOS 无效，设置为 manual 示意用户批准隐衷政策后才获取 idfv，设置为其它值示意利用启动时主动获取
},
"sdkConfigs": {
// 可选，JSON 对象，三方 SDK 相干配置
"geolocation": {// 可选，JSON 对象，Geolocation(定位)模块三方 SDK 配置
"system": {
// 可选，JSON 对象，应用零碎定位
"__platform__": ["ios", "android"] // 可选，字符串数组类型，反对的平台
},
"amap": {
// 可选，JSON 对象，应用高德定位 SDK 配置
"__platform__": ["ios", "android"], // 可选，字符串数组类型，反对的平台
"appkey_ios": "", // 必填，字符串类型，iOS 平台高德定位 appkey"appkey_android":"" // 必填，字符串类型，Android 平台高德定位 appkey
},
"baidu": {
// 可选，JSON 对象，应用百度定位 SDK 配置
"__platform__": ["ios", "android"], // 可选，字符串数组类型，反对的平台
"appkey_ios": "", // 必填，字符串类型，iOS 平台百度定位 appkey"appkey_android":"" // 必填，字符串类型，Android 平台百度定位 appkey
}
},
"maps": {// 可选，JSON 对象，Maps(地图)模块三方 SDK 配置
"amap": {
// 可选，JSON 对象，应用高德地图 SDK 配置
"appkey_ios": "", // 必填，字符串类型，iOS 平台高德地图 appkey"appkey_android":"" // 必填，字符串类型，Android 平台高德地图 appkey
},
"baidu": {
// 可选，JSON 对象，应用百度地图 SDK 配置
"appkey_ios": "", // 必填，字符串类型，iOS 平台百度地图 appkey"appkey_android":"" // 必填，字符串类型，Android 平台百度地图 appkey
},
"google": {
// 可选，JSON 对象，应用 Google 地图 SDK 配置
"APIKey_ios": "", // 必填，字符串类型，iOS 平台 Google 地图 APIKey"APIKey_android":"" // 必填，字符串类型，Android 平台 Google 地图 APIKey
}
},
"oauth": {// 可选，JSON 对象，OAuth(登录鉴权)模块三方 SDK 配置
"univerify": {// 可选，JSON 对象，应用一键登录(univerify)SDK 配置，无需手动配置参数，云端打包主动获取配置参数
},
"apple": {// 可选，JSON 对象，应用苹果登录(Sign in with Apple)SDK 配置，无配置参数，仅 iOS 平台反对
},
"weixin": {
// 可选，JSON 对象，应用微信登录 SDK 配置
"appid": "", // 必填，字符串类型，微信开放平台申请的 appid"appsecret":"", // 必填，字符串类型，微信开放平台申请的 appsecret
"UniversalLinks": "" // 可选，字符串类型，微信开放平台配置的 iOS 平台通用链接
},
"qq": {
// 可选，JSON 对象，应用 QQ 登录 SDK 配置
"appid": "", // 必填，字符串类型，QQ 开放平台申请的 appid"UniversalLinks":"" // 可选，字符串类型，QQ 开放平台配置的 iOS 平台通用链接
},
"sina": {
// 可选，JSON 对象，应用新浪微博登录 SDK 配置
"appkey": "", // 必填，字符串类型，新浪微博开放平台申请的 appid"redirect_uri":"", // 必填，字符串类型，新浪微博开放平台配置的 redirect_uri
"UniversalLinks": "" // 可选，字符串类型，新浪微博开放平台配置的 iOS 平台通用链接
},
"google": {
// 可选，JSON 对象，应用 Google 登录 SDK 配置
"clientid": "" // 必填，字符串类型，Google 开发者后盾申请的 clientid
},
"facebook": {
// 可选，JSON 对象，应用 Facebook 登录 SDK 配置
"appid": "" // 必填，字符串类型，Facebook 开发者后盾申请的 appid
}
},
"payment": {// 可选，JSON 对象，Payment(领取)模块三方 SDK 配置
"appleiap": {// 可选，JSON 对象，应用 Apple 利用内领取配置，无配置参数，仅 iOS 平台反对},
"alipay": {
// 可选，JSON 对象，应用支付宝领取 SDK 配置
"__platform__": ["ios", "android"] // 可选，字符串数组类型，反对的平台
},
"weixin": {
// 可选，JSON 对象，应用微信领取 SDK 配置
"__platform__": ["ios", "android"], // 可选，字符串数组类型，反对的平台
"appid": "", // 必填，字符串类型，微信开放平台申请的 appid"UniversalLinks":"" // 可选，字符串类型，微信开放平台配置的 iOS 平台通用链接
},
"paypal": {
// 可选，JSON 对象，应用 paypal 领取 SDK 配置
"__platform__": ["ios", "android"], // 可选，字符串数组类型，反对的平台
"returnURL_ios": "", // 必填，字符串类型，paypa 开发者者后盾配置的 iOS 平台 returnURL"returnURL_android":"" // 必填，字符串类型，paypa 开发者者后盾配置的 Android 平台 returnURL
},
"stripe": {
// 可选，JSON 对象，应用 stripe 领取 SDK 配置
"__platform__": ["ios", "android"], // 可选，字符串数组类型，反对的平台
"returnURL_ios": "" // 必填，字符串类型，stripe 开发者者后盾配置的 iOS 平台 returnURL
},
"google": {// 可选，JSON 对象，应用 google 领取 SDK 配置，无配置参数，仅 Android 平台反对}
},
"push": {// 可选，JSON 对象，Push(音讯推送)模块三方 SDK 配置
"unipush": {
// 可选，JSON 对象，应用 UniPush SDK 配置，无需手动配置参数，云端打包主动获取配置参数
"icons": {
// 可选，JSON 对象，推送图标配置
"push": {
// 可选，JSON 对象，Push 图标配置
"ldpi": "", // 可选，字符串类型，一般屏设施推送图标门路，分辨率要求 48x48"mdpi":"", // 可选，字符串类型，大屏设施设施推送图标门路，分辨率要求 48x48
"hdpi": "", // 可选，字符串类型，高分屏设施推送图标门路，分辨率要求 72x72"xdpi":"", // 可选，字符串类型，720P 高分屏设施推送图标门路，分辨率要求 96x96
"xxdpi": "", // 可选，字符串类型，1080P 高密度屏幕推送图标门路，分辨率要求 144x144"xxxdpi":"" // 可选，字符串类型，4K 屏设施推送图标门路，分辨率要求 192x192
},
"smal": {
// 可选，JSON 对象，Push 小图标配置
"ldpi": "", // 可选，字符串类型，一般屏设施推送小图标门路，分辨率要求 18x18"mdpi":"", // 可选，字符串类型，大屏设施设施推送小图标门路，分辨率要求 24x24
"hdpi": "", // 可选，字符串类型，高分屏设施推送小图标门路，分辨率要求 36x36"xdpi":"", // 可选，字符串类型，720P 高分屏设施推送小图标门路，分辨率要求 48x48
"xxdpi": "", // 可选，字符串类型，1080P 高密度屏幕推送小图标门路，分辨率要求 72x72"xxxdpi":"" // 可选，字符串类型，4K 屏设施推送小图标门路，分辨率要求 96x96
}
}
},
"igexin": {
// 可选，JSON 对象，应用个推推送 SDK 配置，** 已废除，举荐应用 UniPush，UniPush 是个推推送 VIP 版，性能更弱小 **
"appid": "", // 必填，字符串类型，个推开放平台申请的 appid"appkey":"", // 必填，字符串类型，个推开放平台申请的 appkey
"appsecret": "", // 必填，字符串类型，个推开放平台申请的 appsecret"icons": {
// 可选，JSON 对象，推送图标配置
"push": {
// 可选，JSON 对象，Push 图标配置
"ldpi": "", // 可选，字符串类型，一般屏设施推送图标门路，分辨率要求 48x48"mdpi":"", // 可选，字符串类型，大屏设施设施推送图标门路，分辨率要求 48x48
"hdpi": "", // 可选，字符串类型，高分屏设施推送图标门路，分辨率要求 72x72"xdpi":"", // 可选，字符串类型，720P 高分屏设施推送图标门路，分辨率要求 96x96
"xxdpi": "", // 可选，字符串类型，1080P 高密度屏幕推送图标门路，分辨率要求 144x144"xxxdpi":"" // 可选，字符串类型，4K 屏设施推送图标门路，分辨率要求 192x192
},
"smal": {
// 可选，JSON 对象，Push 小图标配置
"ldpi": "", // 可选，字符串类型，一般屏设施推送小图标门路，分辨率要求 18x18"mdpi":"", // 可选，字符串类型，大屏设施设施推送小图标门路，分辨率要求 24x24
"hdpi": "", // 可选，字符串类型，高分屏设施推送小图标门路，分辨率要求 36x36"xdpi":"", // 可选，字符串类型，720P 高分屏设施推送小图标门路，分辨率要求 48x48
"xxdpi": "", // 可选，字符串类型，1080P 高密度屏幕推送小图标门路，分辨率要求 72x72"xxxdpi":"" // 可选，字符串类型，4K 屏设施推送小图标门路，分辨率要求 96x96
}
}
}
},
"share": {// 可选，JSON 对象，Share(分享)模块三方 SDK 配置
"weixin": {
// 可选，JSON 对象，应用微信分享 SDK 配置
"appid": "", // 必填，字符串类型，微信开放平台申请的 appid"UniversalLinks":"" // 可选，字符串类型，微信开放平台配置的 iOS 平台通用链接
},
"qq": {
// 可选，JSON 对象，应用 QQ 分享 SDK 配置
"appid": "", // 必填，字符串类型，QQ 开放平台申请的 appid"UniversalLinks":"" // 可选，字符串类型，QQ 开放平台配置的 iOS 平台通用链接
},
"sina": {
// 可选，JSON 对象，应用新浪微博分享 SDK 配置
"appkey": "", // 必填，字符串类型，新浪微博开放平台申请的 appid"redirect_uri":"", // 必填，字符串类型，新浪微博开放平台配置的 redirect_uri
"UniversalLinks": "" // 可选，字符串类型，新浪微博开放平台配置的 iOS 平台通用链接
}
},
"speech": {// 可选，JSON 对象，Speech(语音辨认)模块三方 SDK 配置
"baidu": {
// 可选，JSON 对象，应用百度语音辨认 SDK 配置
"appid": "", // 必填，字符串类型，百度开放平台申请的 appid"apikey":"", // 必填，字符串类型，百度开放平台申请的 apikey
"secretkey": "" // 必填，字符串类型，百度开放平台申请的 secretkey
}
},
"statics": {// 可选，JSON 对象，Statistic(统计)模块三方 SDK 配置
"umeng": {
// 可选，JSON 对象，应用友盟统计 SDK 配置
"appkey_ios": "", // 必填，字符串类型，友盟统计开放平台申请的 iOS 平台 appkey"channelid_ios":"", // 可选，字符串类型，友盟统计 iOS 平台的渠道标识
"appkey_android": "", // 必填，字符串类型，友盟统计开放平台申请的 Android 平台 appkey"channelid_android":"" // 可选，字符串类型，友盟统计 Android 平台的渠道标识
},
"google": {
// 可选，JSON 对象，应用 Google Analytics for Firebase 配置
"config_ios": "", // 必填，字符串类型，Google Firebase 统计开发者后盾获取的 iOS 平台配置文件门路"config_android":"" // 必填，字符串类型，Google Firebase 统计开发者后盾获取的 Android 平台配置文件门路
}
},
"ad": {
// 可选，JSON 对象，uni-AD 配置
"360": {// 可选，JSON 对象，应用 360 广告联盟 SDK，无需手动配置，在 uni-AD 后盾申请开明后主动获取配置参数},
"csj": {// 可选，JSON 对象，应用今日头条穿山甲广告联盟 SDK，无需手动配置，在 uni-AD 后盾申请开明后主动获取配置参数},
"gdt": {// 可选，JSON 对象，应用腾讯优量汇广告联盟 SDK，无需手动配置，在 uni-AD 后盾申请开明后主动获取配置参数},
"ks": {// 可选，JSON 对象，应用快手广告联盟 SDK，无需手动配置，在 uni-AD 后盾申请开明后主动获取配置参数},
"ks-content": {// 可选，JSON 对象，应用快手内容联盟 SDK，无需手动配置，在 uni-AD 后盾申请开明后主动获取配置参数},
"sigmob": {// 可选，JSON 对象，应用 Sigmob 广告联盟 SDK，无需手动配置，在 uni-AD 后盾申请开明后主动获取配置参数},
"hw": {// 可选，JSON 对象，应用华为广告联盟 SDK，无需手动配置，在 uni-AD 后盾申请开明后主动获取配置参数},
"bd": {// 可选，JSON 对象，应用百度百青藤广告联盟 SDK，无需手动配置，在 uni-AD 后盾申请开明后主动获取配置参数},
"BXM-AD": {// 可选，JSON 对象，应用互动游戏(变现猫)SDK，无需手动配置，在 uni-AD 后盾申请开明后主动获取配置参数
}
}
},
"icons": {
// 可选，JSON 对象，利用图标相干配置
"ios": {
// 可选，JSON 对象，iOS 平台图标配置
"appstore": "", // 必填，字符串类型，分辨率 1024x1024, 提交 app sotre 应用的图标门路"iphone": {
// 可选，JSON 对象，iPhone 设施图标配置
"app@2x": "", // 可选，字符串类型，分辨率 120x120，程序图标门路"app@3x":"", // 可选，字符串类型，分辨率 180x180，程序图标门路
"spotlight@2x": "", // 可选，字符串类型，分辨率 80x80，Spotlight 搜寻图标门路"spotlight@3x":"", // 可选，字符串类型，分辨率 120x120，Spotlight 搜寻图标门路
"settings@2x": "", // 可选，字符串类型，分辨率 58x58，Settings 设置图标门路"settings@3x":"", // 可选，字符串类型，分辨率 87x87，Settings 设置图标门路
"notification@2x": "", // 可选，字符串类型，分辨率 40x40，告诉栏图标门路"notification@3x":"" // 可选，字符串类型，分辨率 60x60，告诉栏图标门路
},
"ipad": {
// 可选，JSON 对象，iPad 设施图标配置
"app": "", // 可选，字符串类型，分辨率 76x76，程序图标图标门路"app@2x":"", // 可选，字符串类型，分辨率 152x152，程序图标图标门路
"proapp@2x": "", // 可选，字符串类型，分辨率 167x167，程序图标图标门路"spotlight":"", // 可选，字符串类型，分辨率 40x40，Spotlight 搜寻图标门路
"spotlight@2x": "", // 可选，字符串类型，分辨率 80x80，Spotlight 搜寻图标门路"settings":"", // 可选，字符串类型，分辨率 29x29，Settings 设置图标门路
"settings@2x": "", // 可选，字符串类型，分辨率 58x58，Settings 设置图标门路"notification":"", // 可选，字符串类型，分辨率 20x20，告诉栏图标门路
"notification@2x": "" // 可选，字符串类型，分辨率 740x40，告诉栏图标门路
}
},
"android": {
// 可选，JSON 对象，Android 平台图标配置
"ldpi": "", // 可选，字符串类型，一般屏设施程序图标，分辨率要求 48x48，已废除"mdpi":"", // 可选，字符串类型，大屏设施程序图标，分辨率要求 48x48，已废除
"hdpi": "", // 可选，字符串类型，高分屏设施程序图标，分辨率要求 72x72"xhdpi":"", // 可选，字符串类型，720P 高分屏设施程序图标，分辨率要求 96x96
"xxhdpi": "", // 可选，字符串类型，1080P 高分屏设施程序图标，分辨率要求 144x144"xxxhdpi":"" // 可选，字符串类型，2K 屏设施程序图标，分辨率要求 192x192
}
},
"splashscreen": {
// 可选，JSON 对象，启动界面配置
"iosStyle": "common", // 可选，字符串类型，iOS 平台启动界面款式，可取值 common、default、storyboard
"ios": {
// 可选，JSON 对象，iOS 平台启动界面配置
"storyboard": "", // 可选，字符串类型，自定义 storyboard 启动界面文件门路，iosStyle 值为 storyboard 时失效"iphone": {
// 可选，JSON 对象，iPhone 设施启动图配置，iosStyle 值为 default 时失效
"default": "", // 可选，字符串类型，分辨率 320x480，iPhone3（G/GS）启动图片门路，已废除"retina35":"", // 可选，字符串类型，分辨率 640x960，3.5 英寸设施 (iPhone4/4S) 启动图片门路，已废除
"retina40": "", // 可选，字符串类型，分辨率 640x1136，4.0 英寸设施 (iPhone5/5S) 启动图片门路"retina40l":"", // 可选，字符串类型，分辨率 1136x640，4.0 英寸设施 (iPhone5/5S) 横屏启动图片门路
"retina47": "", // 可选，字符串类型，分辨率 750x1334，4.7 英寸设施（iPhone6/7/8）启动图片门路"retina47l":"", // 可选，字符串类型，分辨率 1334x750，4.7 英寸设施（iPhone6/7/8）横屏启动图片门路
"retina55": "", // 可选，字符串类型，分辨率 1242x2208，5.5 英寸设施（iPhone6/7/8Plus）启动图片门路"retina55l":"", // 可选，字符串类型，分辨率 2208x1242，5.5 英寸设施（iPhone6/7/8Plus）横屏启动图片门路
"iphonex": "", // 可选，字符串类型，分辨率 1125x2436，5.8 英寸设施（iPhoneX/XS）启动图片门路"iphonexl":"", // 可选，字符串类型，分辨率 2436x1125，5.8 英寸设施（iPhoneX/XS）横屏启动图片门路
"portrait-896h@2x": "", // 可选，字符串类型，分辨率 828x1792，6.1 英寸设施（iPhoneXR）启动图片门路"landscape-896h@2x":"", // 可选，字符串类型，分辨率 1792x828，6.1 英寸设施（iPhoneXR）iPhoneXR 横屏启动图片门路
"portrait-896h@3x": "", // 可选，字符串类型，分辨率 1242x2688，6.5 英寸设施（iPhoneXS Max）启动图片门路"landscape-896h@3x":"" // 可选，字符串类型，分辨率 2688x1242，6.5 英寸设施（iPhoneXS Max）横屏启动图片门路
},
"ipad": {
// 可选，JSON 对象，iPad 设施启动图配置，iosStyle 值为 default 时失效
"portrait": "", // 可选，字符串类型，分辨率 768x1004，iPad 竖屏启动图片门路，已废除"portrait-retina":"", // 可选，字符串类型，分辨率 1536x2008，iPad 高分屏竖屏启动图片门路，已废除
"landscape": "", // 可选，字符串类型，分辨率 1024x748，iPad 横屏启动图片门路，已废除"landscape-retina":"", // 可选，字符串类型，分辨率 2048x1496，iPad 高分屏横屏启动图片门路，已废除
"portrait7": "", // 可选，字符串类型，分辨率 768x1024，9.7/7.9 英寸 iPad/mini 竖屏启动图片门路"landscape7":"", // 可选，字符串类型，分辨率 1024x768，9.7/7.9 英寸 iPad/mini 横屏启动图片门路
"portrait-retina7": "", // 可选，字符串类型，分辨率 1536x2048，9.7/7.9 英寸 iPad/mini 高分屏竖屏图片门路"landscape-retina7":"", // 可选，字符串类型，分辨率 2048x1536，9.7/7.9 英寸 iPad/mini 高分屏横屏启动图片门路
"portrait-1112h@2x": "", // 可选，字符串类型，分辨率 1668x2224，10.5 英寸 iPad Pro 竖屏启动图片门路"landscape-1112h@2x":"", // 可选，字符串类型，分辨率 2224x1668，10.5 英寸 iPad Pro 横屏启动图片门路
"portrait-1194h@2x": "", // 可选，字符串类型，分辨率 1668x2388，11 英寸 iPad Pro 竖屏启动图片门路"landscape-1194h@2x":"", // 可选，字符串类型，分辨率 2388x1668，11 英寸 iPad Pro 横屏启动图片门路
"portrait-1366h@2x": "", // 可选，字符串类型，分辨率 2048x2732，12.9 英寸 iPad Pro 竖屏启动图片门路"landscape-1366h@2x":"" // 可选，字符串类型，分辨率 2732x2048，12.9 英寸 iPad Pro 横屏启动图片门路
}
},
"androidStyle": "common", // 可选，字符串类型，Android 平台启动界面款式，可取值 common、default
"android": {
// 可选，JSON 对象，Android 平台启动图片配置，androidStyle 值为 default 时失效
"ldpi": "", // 可选，字符串类型，分辨率 320x442，低密度屏幕启动图片门路，已废除"mdpi":"", // 可选，字符串类型，分辨率 240x282，中密度屏幕启动图片门路，已废除
"hdpi": "", // 可选，字符串类型，分辨率 480x762，高密度屏幕启动图片门路"xhdpi":"", // 可选，字符串类型，分辨率 720x1242，720P 高密度屏幕启动图片门路
"xxhdpi": "" // 可选，字符串类型，分辨率 1080x1882，1080P 高密度屏幕启动图片门路
}
},
"orientation": [
// 可选，字符串数组类型，利用反对的横竖屏，** 已废除，应用 screenOrientation 配置 **
"portrait-primary",
"portrait-secondary",
"landscape-primary",
"landscape-secondary"
]
},
"compatible": {
// 可选，JSON 对象，uni-app 兼容模式
"ignoreVersion": false, // 可选，Boolean 类型，是否疏忽版本兼容查看提醒
"runtimeVersion": "", // 可选，字符串类型，兼容的 uni-app 运行环境版本号，多个版本应用, 宰割"compilerVersion":"" // 可选，字符串类型，兼容的编译器版本号
},
"confusion": {
// 可选，JSON 对象，原生混同加密配置，参考：https://uniapp.dcloud.io/tutorial/app-sec-confusion
"description": "", // 可选，字符串类型，原生混同形容"resources": {
// 必填，JSON 对象，原生混同文件配置
"js/common.js": {// 可选，JSON 对象，键名为须要原生混同的文件门路}
}
},
"channel": "", // 可选，字符串类型，渠道标识"cers": {
// 可选，JSON 对象，利用的异样解体与错误报告系统配置
"crash": true // 可选，Boolean 类型，是否提交利用异样解体信息
},
"cache": {
// 可选，JSON 对象，Webview 窗口默认应用的缓存模式，uni-app 我的项目已废除
"mode": "default" // 可选，字符串类型，可取值 default、cacheElseNetwork、noCache、cacheOnly
},
"error": {
// 可选，JSON 对象，页面加载谬误配置，uni-app 我的项目仅对 webview 组件无效，参考：https://uniapp.dcloud.io/tutorial/app-webview-error
"url": "" // 必填，字符串类型，webview 页面谬误是跳转的页面地址
},
"kernel": {
// 可选，JSON 对象，webview 内核配置
"ios": "WKWebview", // 可选，iOS 平台应用的 webview 类型，可取值 WKWebview、UIWebview
"recovery": "reload" // 可选，iOS 平台应用 WKWebview 时，内核解体后的解决逻辑，可取值 restart、reload、none
},
"launchwebview": {
// 可选，JSON 对象，利用首页相干配置，uni-app 我的项目不倡议手动批改
"plusrequire": "normal", // 可选，字符串类型，加载 plus API 机会，可取值 ahead、normal、later、none
"injection": false, // 可选，Boolean 类型，是否提前注入 plus API
"overrideresource": [
// 可选，JSON 对象数组，利用首页的拦挡资源相干配置
{
"match": "", // 可选，字符串类型，匹配拦挡的资源 url 地址的正则表达式"redirect":"", // 可选，字符串类型，拦挡资源的重定向地址
"mime": "", // 可选，字符串类型，拦挡资源的数据类型 mime"encoding":"", // 可选，字符串类型，拦挡资源的数据编码
"header": {// 可选，JSON 对象，拦挡资源的 http 头数据}
}
],
"overrideurl": {
// 可选，JSON 对象，利用首页的拦挡链接申请解决逻辑
"mode": "reject", // 可选，字符串类型，拦挡模式，可取值 allow、reject
"match": "", // 可选，字符串类型，匹配拦挡规定，反对正则表达式"exclude":"none" // 可选，字符串类型，排除拦挡理规定，可取值 none、redirect
},
"replacewebapi": {
// 可选，JSON 对象，是否重写 Web API 实现相干配置
"geolocation": "none" // 可选，字符串类型，重写规范定位 API，可取值 none、alldevice、auto
},
"subNViews": [
// 可选，JSON 对象数组，首页原生 View 相干配置，已废除
{
"id": "", // 可选，字符串类型，原生 View 标识"styles": {// 可选，JSON 对象，原生 View 款式},
"tags": [
// 可选，JSON 对象数组，原生 View 中蕴含的 tag 标签列表
{}]
}
],
"titleNView": {
// 可选，JSON 对象，标题栏相干配置
"backgroundColor": "#RRGGBB", // 可选，字符串类型，#RRGGBB 格局，标题栏背景色彩
"titleText": "", // 可选，字符串类型，标题栏题目文字内容"titleColor":"#RRGGBB", // 可选，字符串类型，#RRGGBB 格局，标题栏题目文字色彩"titleSize":"17px", // 可选，字符串类型，题目字体大小，默认大小为 17px"autoBackButton": true, // 可选，Boolean 类型，是否显示标题栏上返回键"backButton": {
// 可选，JSON 对象，返回键款式
"backgournd": "#RRGGBB", // 可选，字符串类型，#RRGGBB 格局，返回按钮背景色彩
"color": "#RRGGBB", // 可选，字符串类型，#RRGGBB 格局，返回图标色彩
"colorPressed": "#RRGGBB" // 可选，字符串类型，#RRGGBB，返回图标按下时的色彩
},
"buttons": [
// 可选，JSON 对象数组，标题栏按钮配置
{
"color": "#RRGGBB", // 可选，字符串类型，#RRGGBB 格局，按钮上的文字色彩
"colorPressed": "#RRGGBB", // 可选，字符串类型，#RRGGBB 格局，按钮按下状态的文字色彩
"float": "right", // 可选，字符串类型，按钮显示地位，可取值 left、right
"fontWeight": "normal", // 可选，字符串类型，按钮上文字的粗细，可取值 normal、bold
"fontSize": "22px", // 可选，字符串类型，按钮上文字的大小
"fontSrc": "", // 可选，字符串类型，按钮上文字应用的字体文件门路"text":"" // 可选，字符串类型，按钮上显示的文字
}
],
"splitLine": {
// 可选，JSON 对象，标题栏分割线款式
"color": "#RRGGBB", // 可选，字符串类型，#RRGGBB 格局，分割线色彩
"height": "1px" // 可选，字符串类型，分割线高度
}
},
"statusbar": {
// 可选，JSON 对象，状态栏配置
"background": "#RRGGBB" // 可选，字符串类型，#RRGGBB 格局，沉迷式状态栏款式下零碎状态栏背景色彩
},
"top": "0px", // 可选，字符串类型，Webview 的顶部偏移量，反对 px、% 单位
"height": "100%", // 可选，字符串类型，Webview 窗口高度，反对 px、% 单位
"bottom": "0px", // 可选，字符串类型，Webview 的底部偏移量，仅在未同时设置 top 和 height 属性时失效
"backButtonAutoControl": "none", // 可选，字符串类型，运行环境主动解决返回键的管制逻辑，可取值 none、hide、close
"additionalHttpHeaders": {// 可选，JSON 对象，额定增加 HTTP 申请头数据}
},
"nativePlugins": {
// 可选，JSON 数组对象，uni 原生插件配置，参考：https://nativesupport.dcloud.net.cn/NativePlugin/use/use_local_plugin
"%UniPlugin-ID%": {// 可选，JSON 对象，键名为插件标识，值为插件配置参数}
},
"popGesture": "none", // 可选，字符串类型，窗口侧滑返回默认成果，可取值 none、close、hide
"runmode": "liberate", // 可选，字符串类型，利用资源运行模式，可取值 normal、liberate
"safearea": {
// 可选，JSON 对象，平安区域配置
"background": "#RRGGBB", // 可选，字符串类型，#RRGGBB 格局，平安区域背景色彩
"backgroundDark": "#RRGGBB", // 可选，字符串类型，#RRGGBB 格局，暗黑模式平安区域背景色彩
"bottom": {
// 可选，JSON 对象，底部平安区域配置
"offset": "none" // 可选，字符串类型，平安区域偏移值，可取值 auto、none
},
"left": {
// 可选，JSON 对象，左侧平安区域配置
"offset": "none" // 可选，字符串类型，平安区域偏移值，可取值 auto、none
},
"right": {
// 可选，JSON 对象，左侧平安区域配置
"offset": "none" // 可选，字符串类型，平安区域偏移值，可取值 auto、none
}
},
"softinput": {
// 可选，JSON 对象，软键盘相干配置
"navBar": "auto", // 可选，字符串类型，iOS 平台软键盘上导航条的显示模式，可取值 auto、none
"auxiliary": false, // 可选，Boolean 类型，是否开启辅助输入性能
"mode": "adjustResize" // 可选，字符串类型，弹出零碎软键盘模式，可取值 adjustResize、adjustPan
},
"ssl": {
// 可选，JSON 对象，ssl 相干设置
"untrustedca": "accept" // 可选，字符串类型，https 申请时服务器非受信证书的解决逻辑，可取值 accept、refuse、warning
},
"statusbar": {
// 可选，JSON 对象，利用启动后的零碎状态栏相干配置
"immersed": "none", // 可选，字符串类型，沉迷式状态栏款式，可取值 none、suggestedDevice、supportedDevice
"style": "light", // 可选，字符串类型，零碎状态栏款式（前景色彩），可取值 dark、light
"background": "#RRGGBB" // 可选，字符串类型，#RRGGBB 格局，零碎状态栏背景色彩
},
"useragent": {
// 可选，JSON 对象，利用 UserAgent 相干配置，默认值为零碎 UserAgent，并增加 uni-app Html5Plus/1.0
"value": "", // 可选，字符串类型，设置的默认 userAgent 值"concatenate": false // 可选，Boolean 类型，是否将 value 值作为追加值连贯到零碎默认 userAgent 值之后
},
"useragent_android": {
// 可选，JSON 对象，Android 平台利用 UserAgent 相干配置，优先级高于 useragent 配置
"value": "", // 可选，字符串类型，设置的默认 userAgent 值"concatenate": false // 可选，Boolean 类型，是否将 value 值作为追加值连贯到零碎默认 userAgent 值之后
},
"useragent_ios": {
// 可选，JSON 对象，iOS 平台利用 UserAgent 相干配置，优先级高于 useragent 配置
"value": "", // 可选，字符串类型，设置的默认 userAgent 值"concatenate": false // 可选，Boolean 类型，是否将 value 值作为追加值连贯到零碎默认 userAgent 值之后
}
},
"quickapp": {},
"mp-weixin": {
"appid": "wx 结尾的微信小程序 appid",
"uniStatistics": {"enable": false}
},
"mp-baidu": {"appid": "百度小程序 appid"},
"mp-toutiao": {"appid": "抖音小程序 appid"},
"mp-lark": {"appid": "飞书小程序 appid"},
"h5": {
"title": "演示",
"template": "index.html",
"router": {
"mode": "history",
"base": "/hello/"
},
"async": {
"loading": "AsyncLoading",
"error": "AsyncError",
"delay": 200,
"timeout": 3000
}
}
}- uni.scss
这个是全局的款式文件，官网预约了很多罕用的款式规定和变量。
- package.json
在 web 和小程序增加一些依赖包，扩大其余的性能。
- vite.config.js
vue3 我的项目生成的配置文件。
全局组件
全局组件次要是内置组件和扩大组件。
内置组件
所有的视图组件，包含 view、swiper 等，自身不显示任何可视化元素，用处都是为了包裹其余真正显示的组件，能够间接在 vue 页面中应用。
常见有：
- uniapp 组件
- vue 组件
- nvue 组件
- 小程序组件
扩大组件
uni-ui 是 DCloud 提供的一个跨端 ui 库，它是基于 vue 组件的、flex 布局的、无 dom 的跨全端 ui 框架，不包含根底组件，它是根底组件的补充，有些组件须要到插件市场下载才能够应用。
常见有：
- 列表组件
- 表单组件
- 表格组件
- 加载更多组件
- 自定义导航栏组件
- 弹出层组件
罕用 API
根底
onPageNotFound，页面不存在事件；onError，谬误事件；onAppShow，页面前台事件；onAppHide，页面后盾事件；addInterceptor，拦截器；
网络
request，发动申请；uploadFile，上传文件；downloadFile，下载文件；connectSocket，创立一个 websocket 连贯；onSocketOpen，ws 关上事件；onSocketError，谬误事件；sendSocketMessage，发送 ws 音讯；onSocketMessage，接管 ws 音讯；closeSocket，敞开 ws；onSocketClose，监听敞开 ws；
页面路由
navigateTo，保留以后页面，跳转到其余页面；redirectTo，敞开以后页面，跳转到其余页面；reLaunch，敞开所有页面，跳转到其余页面；switchTab，跳转到 tabBar 底部导航页面；navigateBack，返回上一个页面或多级页面；
数据缓存
setStorage，将数据存储在本地缓存中的指定 key 中，笼罩原来该 key 的内容；getStorage，从本地缓存中获取指定 key 的内容；removeStorage，从本地缓存中移除指定 key 及内容；clearStorage，革除本地缓存；getStorageInfo，获取本地缓存信息；
界面
showToast，显示音讯提示框；hideToast，暗藏音讯提示框；showLoading，显示加载提示框；hideLoading，暗藏加载提示框；showModal，显示模态弹出框；showActionSheet，从底部弹出操作菜单；onPullDownRefresh，下拉刷新；createSelectorQuery，节点信息；
文件
chooseImage，抉择图片；saveImageToPhotosAlbum，保留图片到相册；chooseFile，抉择文件；saveFile，保留文件到本地；removeSavedFile，删除本地保留的文件；getSavedFileList，获取本地保留的文件列表；getFileInfo，获取文件信息；openDocument，新页面打开文档；
条件编译
概念
条件编译 是用非凡的正文作为标记，在编译时依据这些非凡的正文，将正文外面的代码编译到不同平台。
写法：以 #ifdef 或 #ifndef 加 %PLATFORM% 结尾，以 #endif 结尾。
#ifdef：if defined 仅在某平台存在;#ifndef：if not defined 除了某平台均存在;%PLATFORM%：平台名称;
%PLATFORM%值：
| 值 | 失效条件 |
|---|---|
| VUE3 | HBuilderX 3.2.0+ 详情（uni-app js 引擎版） |
| APP | App |
| APP-PLUS | App（uni-app js 引擎版） |
| APP-PLUS-NVUE 或 APP-NVUE | App nvue 页面 |
| APP-ANDROID | App Android 平台 仅限 uts 文件 |
| APP-IOS | App iOS 平台 仅限 uts 文件 |
| H5 | H5 |
| MP-WEIXIN | 微信小程序 |
| MP-ALIPAY | 支付宝小程序 |
| MP-BAIDU | 百度小程序 |
| MP-TOUTIAO | 抖音小程序 |
| MP-LARK | 飞书小程序 |
| MP-QQ | QQ 小程序 |
| MP-KUAISHOU | 快手小程序 |
| MP-JD | 京东小程序 |
| MP-360 | 360 小程序 |
| MP | 微信小程序 / 支付宝小程序 / 百度小程序 / 抖音小程序 / 飞书小程序 /QQ 小程序 /360 小程序 |
| QUICKAPP-WEBVIEW | 快利用通用(蕴含联盟、华为) |
| QUICKAPP-WEBVIEW-UNION | 快利用联盟 |
| QUICKAPP-WEBVIEW-HUAWEI | 快利用华为 |
反对的文件
- .vue、.pug
- .css、.scss、.less、.stylus
- .js、.ts
- pages.json
写法
vue/nvue 模板里应用 <!-- 正文 -->，css 应用 /* 正文 */，js 应用 // 正文。
- 模板写法
<!-- #ifdef %PLATFORM% -->
平台特有的组件
<!-- #endif -->- css 款式写法
/* #ifdef %PLATFORM% */
平台特有款式
/* #endif */- JS 写法
// #ifdef %PLATFORM%
平台特有的 API 实现;
// #endif- pages.json
// #ifdef %PLATFORM%
{
"pagePath": "pages/eg",
"text": "案例"
}
// #endif插件开发
插件市场官网
有数千款插件，反对前端组件、js sdk、页面模板、我的项目模板、原生插件等多种类型。在生态建设上远远当先于竞品。
请留神尽量在官网市场寻找插件，npm 等三方市场没有 uni-app 兼容性形容，很容易下载到无奈跨平台的、仅适配 web 的插件。
插件分类
DCloud 插件市场将插件分为前端组件、JS SDK、uni-app 前端模板、App 原生插件、uniCloud 等 7 大类、20 多个子类。
uni\_modules
uni\_modules 是 uni-app 的插件模块化标准（HBuilderX 3.1.0+ 反对），通常是对一组 js sdk、组件、页面、uniCloud 云函数、公共模块等的封装，用于嵌入到 uni-app 我的项目中应用，也反对间接封装为我的项目模板。
好了，以上就是 uniapp 的框架常识总结。
正文完
发表至： javascript
2023-08-28
