feat: add __UNI_FEATURE_RPX__

packages/global.d.ts

@@ -15,6 +15,7 @@ declare var __VUE_OPTIONS_API__: boolean
 
 declare var __UNI_FEATURE_WX__: boolean
 declare var __UNI_FEATURE_WXS__: boolean
+declare var __UNI_FEATURE_RPX__: boolean
 declare var __UNI_FEATURE_NVUE__: boolean
 declare var __UNI_FEATURE_PROMISE__: boolean
 declare var __UNI_FEATURE_LONGPRESS__: boolean

packages/uni-core/src/helpers/dom.ts

+import { withModifiers } from 'vue'
+import safeAreaInsets from 'safe-area-insets'
+
+export const onTouchmovePrevent = /*#__PURE__*/ withModifiers(() => {}, [
+  'prevent',
+])
+export const onTouchmoveStop = /*#__PURE__*/ withModifiers(() => {}, ['stop'])
+
+export function getWindowOffset() {
+  const style = document.documentElement.style
+  const top = parseInt(style.getPropertyValue('--window-top'))
+  const bottom = parseInt(style.getPropertyValue('--window-bottom'))
+  const left = parseInt(style.getPropertyValue('--window-left'))
+  const right = parseInt(style.getPropertyValue('--window-right'))
+  return {
+    top: top ? top + safeAreaInsets.top : 0,
+    bottom: bottom ? bottom + safeAreaInsets.bottom : 0,
+    left: left ? left + safeAreaInsets.left : 0,
+    right: right ? right + safeAreaInsets.right : 0,
+  }
+}
+
+interface PageCssVars {
+  '--window-top'?: string
+  '--window-bottom'?: string
+  '--window-left'?: string
+  '--window-right'?: string
+  '--window-margin'?: string
+  '--top-window-height'?: string
+}
+const style = document.documentElement.style
+
+export function updateCssVar(cssVars: Record<string, any>) {
+  Object.keys(cssVars).forEach((name) => {
+    style.setProperty(name, cssVars[name])
+  })
+}
+
+export function updatePageCssVar(cssVars: PageCssVars) {
+  return updateCssVar(cssVars)
+}
+
+interface AppCssVar {
+  '--status-bar-height'?: string
+  '--tab-bar-height'?: string
+}
+
+export function updateAppCssVar(cssVars: AppCssVar) {
+  return updateCssVar(cssVars)
+}
+
+const sheetsMap = new Map()
+
+export function updateStyle(id: string, content: string) {
+  let style = sheetsMap.get(id)
+  if (style && !(style instanceof HTMLStyleElement)) {
+    removeStyle(id)
+    style = undefined
+  }
+  if (!style) {
+    style = document.createElement('style')
+    style.setAttribute('type', 'text/css')
+    style.innerHTML = content
+    document.head.appendChild(style)
+  } else {
+    style.innerHTML = content
+  }
+  sheetsMap.set(id, style)
+}
+
+export function removeStyle(id: string) {
+  let style = sheetsMap.get(id)
+  if (style) {
+    if (style instanceof CSSStyleSheet) {
+      // @ts-ignore
+      const index = document.adoptedStyleSheets.indexOf(style)
+      // @ts-ignore
+      document.adoptedStyleSheets = document.adoptedStyleSheets.filter(
+        (s: CSSStyleSheet) => s !== style
+      )
+    } else {
+      document.head.removeChild(style)
+    }
+    sheetsMap.delete(id)
+  }
+}

packages/uni-core/src/helpers/event.ts

-import { withModifiers } from 'vue'
-export const onTouchmovePrevent = /*#__PURE__*/ withModifiers(() => {}, [
-  'prevent',
-])
-export const onTouchmoveStop = /*#__PURE__*/ withModifiers(() => {}, ['stop'])

packages/uni-core/src/helpers/getWindowOffset.ts

-import safeAreaInsets from 'safe-area-insets'
-
-export function getWindowOffset() {
-  const style = document.documentElement.style
-  const top = parseInt(style.getPropertyValue('--window-top'))
-  const bottom = parseInt(style.getPropertyValue('--window-bottom'))
-  const left = parseInt(style.getPropertyValue('--window-left'))
-  const right = parseInt(style.getPropertyValue('--window-right'))
-  return {
-    top: top ? top + safeAreaInsets.top : 0,
-    bottom: bottom ? bottom + safeAreaInsets.bottom : 0,
-    left: left ? left + safeAreaInsets.left : 0,
-    right: right ? right + safeAreaInsets.right : 0,
-  }
-}

packages/uni-core/src/helpers/index.ts

+export * from './dom'
 export * from './util'
 export * from './icon'
-export * from './event'
 export * from './scroll'
 export * from './getRealRoute'
-export * from './updateCssVar'
-export * from './getWindowOffset'

packages/uni-core/src/helpers/updateCssVar.ts

-interface PageCssVars {
-  '--window-top'?: string
-  '--window-bottom'?: string
-  '--window-left'?: string
-  '--window-right'?: string
-  '--window-margin'?: string
-  '--top-window-height'?: string
-}
-const style = document.documentElement.style
-
-function updateCssVar(cssVars: Record<string, any>) {
-  Object.keys(cssVars).forEach((name) => {
-    style.setProperty(name, cssVars[name])
-  })
-}
-
-export function updatePageCssVar(cssVars: PageCssVars) {
-  return updateCssVar(cssVars)
-}
-
-interface AppCssVar {
-  '--status-bar-height'?: string
-  '--tab-bar-height'?: string
-}
-
-export function updateAppCssVar(cssVars: AppCssVar) {
-  return updateCssVar(cssVars)
-}

packages/uni-core/src/view/plugin/componentInstance.ts

 import { ComponentPublicInstance } from 'vue'
 import { normalizeTarget } from '@dcloudio/uni-shared'
-import { getWindowOffset } from '../../helpers/getWindowOffset'
+import { getWindowOffset } from '../../helpers'
 
 const isClickEvent = (val: Event): val is MouseEvent => val.type === 'click'
 const isMouseEvent = (val: Event): val is MouseEvent =>
   val.type.indexOf('mouse') === 0
-
-export function $normalizeNativeEvent(
-  this: ComponentPublicInstance,
-  evt: Event
-) {
+// normalizeNativeEvent
+export function $nne(this: ComponentPublicInstance, evt: Event) {
   // TODO 目前内置组件底层实现，也会进入以下处理逻辑，可能会有影响
   const { currentTarget } = evt
   if (!(evt instanceof Event) || !(currentTarget instanceof HTMLElement)) {

packages/uni-h5-vue/dist/vue.runtime.esm.js

@@ -8236,6 +8236,10 @@ function autoPrefix(style, rawName) {
 // upx,rpx
 const rpxRE = /\b([+-]?\d+(\.\d+)?)[r|u]px\b/g;
 const normalizeRpx = (val) => {
+    // @ts-ignore
+    if (typeof rpx2px !== 'function') {
+        return val;
+    }
     if (isString(val)) {
         return val.replace(rpxRE, (a, b) => {
             // @ts-ignore
@@ -8398,7 +8402,7 @@ function createInvoker(initialValue, instance) {
         if (timeStamp >= invoker.attached - 1) {
             // fixed by xxxxxx
             const proxy = instance && instance.proxy;
-            const normalizeNativeEvent = proxy && proxy.$normalizeNativeEvent;
+            const normalizeNativeEvent = proxy && proxy.$nne;
             callWithAsyncErrorHandling(patchStopImmediatePropagation(e, invoker.value), instance, 5 /* NATIVE_EVENT_HANDLER */, [normalizeNativeEvent ? normalizeNativeEvent(e) : e]);
         }
     };

packages/uni-h5-vue/lib/vue.runtime.esm.js

@@ -8236,6 +8236,10 @@ function autoPrefix(style, rawName) {
 // upx,rpx
 const rpxRE = /\b([+-]?\d+(\.\d+)?)[r|u]px\b/g;
 const normalizeRpx = (val) => {
+    // @ts-ignore
+    if (typeof rpx2px !== 'function') {
+        return val;
+    }
     if (isString(val)) {
         return val.replace(rpxRE, (a, b) => {
             // @ts-ignore
@@ -8398,7 +8402,7 @@ function createInvoker(initialValue, instance) {
         if (timeStamp >= invoker.attached - 1) {
             // fixed by xxxxxx
             const proxy = instance && instance.proxy;
-            const normalizeNativeEvent = proxy && proxy.$normalizeNativeEvent;
+            const normalizeNativeEvent = proxy && proxy.$nne;
             callWithAsyncErrorHandling(patchStopImmediatePropagation(e, invoker.value), instance, 5 /* NATIVE_EVENT_HANDLER */, [normalizeNativeEvent ? normalizeNativeEvent(e) : e]);
         }
     };

packages/uni-h5/src/framework/components/layout/index.tsx

@@ -2,7 +2,6 @@ import {
   ref,
   withCtx,
   computed,
-  onMounted,
   ComputedRef,
   KeepAlive,
   openBlock,
@@ -17,6 +16,7 @@ import {
 
 import { RouterView, useRoute } from 'vue-router'
 
+import { updateCssVar } from '@dcloudio/uni-core'
 import { useTabBar } from '../../setup/state'
 import { useKeepAliveRoute } from '../../setup/page'
 
@@ -24,19 +24,18 @@ import TabBar from './tabBar'
 
 type KeepAliveRoute = ReturnType<typeof useKeepAliveRoute>
 
-const CSS_VARS = [
-  '--status-bar-height',
-  '--top-window-height',
-  '--window-left',
-  '--window-right',
-  '--window-margin',
-  '--tab-bar-height',
-]
-
+const DEFAULT_CSS_VAR_VALUE = '0px'
+updateCssVar({
+  '--status-bar-height': DEFAULT_CSS_VAR_VALUE,
+  '--top-window-height': DEFAULT_CSS_VAR_VALUE,
+  '--window-left': DEFAULT_CSS_VAR_VALUE,
+  '--window-right': DEFAULT_CSS_VAR_VALUE,
+  '--window-margin': DEFAULT_CSS_VAR_VALUE,
+  '--tab-bar-height': DEFAULT_CSS_VAR_VALUE,
+})
 export default defineComponent({
   name: 'Layout',
   setup(_props, { emit }) {
-    useCssVar()
     const keepAliveRoute = (__UNI_FEATURE_PAGES__ &&
       useKeepAliveRoute()) as KeepAliveRoute
     const topWindow = __UNI_FEATURE_TOPWINDOW__ && useTopWindow()
@@ -57,11 +56,6 @@ export default defineComponent({
     }
   },
 })
-import { updateCssVar } from '../../../helpers/dom'
-
-function useCssVar() {
-  CSS_VARS.forEach((name) => updateCssVar(name, '0px'))
-}
 
 function useAppClass(showTabBar?: ComputedRef<boolean>) {
   const showMaxWidth = ref(false)

packages/uni-h5/src/framework/components/page/pageHead.tsx

@@ -3,9 +3,10 @@ import { extend, isArray } from '@vue/shared'
 import { Input } from '@dcloudio/uni-components'
 import { getRealPath } from '@dcloudio/uni-platform'
 import {
-  ICON_PATH_SEARCH,
-  createSvgIconVNode,
   invokeHook,
+  updateStyle,
+  createSvgIconVNode,
+  ICON_PATH_SEARCH,
 } from '@dcloudio/uni-core'
 import { usePageMeta } from '../../setup/provide'
 import {
@@ -13,8 +14,6 @@ import {
   usePageHeadTransparentBackgroundColor,
 } from './transparent'
 
-import { updateStyle } from '../../../helpers/dom'
-
 const ICON_PATH_BACK =
   'M21.781 7.844l-9.063 8.594 9.063 8.594q0.25 0.25 0.25 0.609t-0.25 0.578q-0.25 0.25-0.578 0.25t-0.578-0.25l-9.625-9.125q-0.156-0.125-0.203-0.297t-0.047-0.359q0-0.156 0.047-0.328t0.203-0.297l9.625-9.125q0.25-0.25 0.578-0.25t0.578 0.25q0.25 0.219 0.25 0.578t-0.25 0.578z'
 

packages/uni-h5/src/helpers/dom.ts

-const sheetsMap = new Map()
-export function updateStyle(id: string, content: string) {
-  let style = sheetsMap.get(id)
-  if (style && !(style instanceof HTMLStyleElement)) {
-    removeStyle(id)
-    style = undefined
-  }
-  if (!style) {
-    style = document.createElement('style')
-    style.setAttribute('type', 'text/css')
-    style.innerHTML = content
-    document.head.appendChild(style)
-  } else {
-    style.innerHTML = content
-  }
-  sheetsMap.set(id, style)
-}
-
-export function removeStyle(id: string) {
-  let style = sheetsMap.get(id)
-  if (style) {
-    if (style instanceof CSSStyleSheet) {
-      // @ts-ignore
-      const index = document.adoptedStyleSheets.indexOf(style)
-      // @ts-ignore
-      document.adoptedStyleSheets = document.adoptedStyleSheets.filter(
-        (s: CSSStyleSheet) => s !== style
-      )
-    } else {
-      document.head.removeChild(style)
-    }
-    sheetsMap.delete(id)
-  }
-}
-
 const screen = window.screen
 const documentElement = document.documentElement
 
-let styleObj: CSSStyleDeclaration
-export function updateCssVar(name: string, value: string) {
-  if (!styleObj) {
-    styleObj = documentElement.style
-  }
-  styleObj.setProperty(name, value)
-}
-
 export function checkMinWidth(minWidth: number) {
   const sizes = [
     window.outerWidth,

packages/vite-plugin-uni/src/configResolved/plugins/pagesJson.ts

@@ -33,7 +33,7 @@ export function uniPagesJsonPlugin(
       if (id.endsWith(PAGES_JSON_JS)) {
         return {
           code:
-            registerGlobalCode +
+            (config.define!.__UNI_FEATURE_RPX__ ? registerGlobalCode : '') +
             (options.command === 'serve' ? registerDevServerGlobalCode : '') +
             parsePagesJson(code, config, options),
           map: { mappings: '' },

packages/vite-plugin-uni/src/utils/define.ts

@@ -24,6 +24,7 @@ interface PagesFeatures {
 interface ManifestFeatures {
   wx: boolean
   wxs: boolean
+  rpx: boolean
   promise: boolean
   longpress: boolean
   routerMode: '"hash"' | '"history"'
@@ -158,6 +159,7 @@ function resolveManifestFeature(
   const features: ManifestFeatures = {
     wx: false,
     wxs: true,
+    rpx: true,
     promise: false,
     longpress: true,
     routerMode: '"hash"',
@@ -217,6 +219,7 @@ export function getFeatures(
   const {
     wx,
     wxs,
+    rpx,
     nvue,
     i18nEn,
     i18nEs,
@@ -245,6 +248,7 @@ export function getFeatures(
   return {
     __UNI_FEATURE_WX__: wx, // 是否启用小程序的组件实例 API，如：selectComponent 等（uni-core/src/service/plugin/appConfig）
     __UNI_FEATURE_WXS__: wxs, // 是否启用 wxs 支持，如：getComponentDescriptor 等（uni-core/src/view/plugin/appConfig）
+    __UNI_FEATURE_RPX__: rpx, // 是否启用运行时 rpx 支持
     __UNI_FEATURE_PROMISE__: promise, // 是否启用旧版本的 promise 支持（即返回[err,res]的格式）,默认返回标准
     __UNI_FEATURE_LONGPRESS__: longpress, // 是否启用longpress
     __UNI_FEATURE_I18N_EN__: i18nEn, // 是否启用en