rn的 支持

ios/Podfile

@@ -24,7 +24,7 @@ target 'hola' do
     # Hermes is now enabled by default. Disable by setting this flag to false.
     # Upcoming versions of React Native may rely on get_default_flags(), but
     # we make it explicit here to aid in the React Native upgrade process.
-    :hermes_enabled => true,
+    :hermes_enabled => false,
     :fabric_enabled => flags[:fabric_enabled],
     # Enables Flipper.
     #

ios/hola.xcodeproj/project.pbxproj

@@ -620,7 +620,7 @@
 				COPY_PHASE_STRIP = NO;
 				ENABLE_STRICT_OBJC_MSGSEND = YES;
 				ENABLE_TESTABILITY = YES;
-				"EXCLUDED_ARCHS[sdk=iphonesimulator*]" = i386;
+				"EXCLUDED_ARCHS[sdk=iphonesimulator*]" = "";
 				GCC_C_LANGUAGE_STANDARD = gnu99;
 				GCC_DYNAMIC_NO_PIC = NO;
 				GCC_NO_COMMON_BLOCKS = YES;
@@ -692,7 +692,7 @@
 				COPY_PHASE_STRIP = YES;
 				ENABLE_NS_ASSERTIONS = NO;
 				ENABLE_STRICT_OBJC_MSGSEND = YES;
-				"EXCLUDED_ARCHS[sdk=iphonesimulator*]" = i386;
+				"EXCLUDED_ARCHS[sdk=iphonesimulator*]" = "";
 				GCC_C_LANGUAGE_STANDARD = gnu99;
 				GCC_NO_COMMON_BLOCKS = YES;
 				GCC_WARN_64_TO_32_BIT_CONVERSION = YES;

src/components/input/SlidngScale.scss

@@ -129,6 +129,9 @@
 }
 
 
+
+
+/* #ifdef weapp */
 .shadow_left {
     pointer-events: none;
     position: absolute;
@@ -162,9 +165,6 @@
     z-index: 100;
 }
 
-/* #ifdef weapp */
-
-
 /* #endif */
 
 /* #ifdef rn */

src/components/layout/Footer.scss

@@ -1,3 +1,4 @@
+/* #ifdef weapp */
 .footer1 {
     position: fixed;
     left: 0;
@@ -15,4 +16,10 @@
     /* 兼容 iOS >= 11.2 */
     // background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, #000000 100%);
     // background: linear-gradient(180deg, red, blue);
-}
+}
+
+/* #endif */
+
+/* #ifdef rn */
+
+/* #endif */

src/components/layout/GlobalModal.scss

@@ -1,5 +1,6 @@
 // GlobalModal.scss
 
+/* #ifdef weapp */
 .modal {
     position: fixed;
     top: 0;
@@ -12,6 +13,12 @@
     align-items: center;
     justify-content: center;
   }
+
+  /* #endif */
+
+/* #ifdef rn */
+
+/* #endif */
   
   .modal-content {
     background-color: white;

src/components/layout/Modal.scss

@@ -13,6 +13,12 @@
     animation: modalBgAnim 0.2s linear forwards;
 }
 
+/* #endif */
+
+/* #ifdef rn */
+
+/* #endif */
+
 @keyframes modalBgAnim {
 
     100% {

src/components/navigation/TabBar.scss

@@ -1,4 +1,5 @@
 
+/* #ifdef weapp */
 .tabbar{
     display: flex;
     position: fixed;
@@ -14,17 +15,22 @@
     padding-bottom: constant(safe-area-inset-bottom);
     /* 兼容 iOS < 11.2 */
     padding-bottom: env(safe-area-inset-bottom);
-    border-top-color: rgba($color: #ffffff, $alpha: 0.2);
+    border-top-color: rgba(255,255,255,0.2);
     border-top-width: 1px;
     border-top-style: solid;
     z-index: 100;
 }
 
+/* #endif */
+
+/* #ifdef rn */
+
+/* #endif */
+
 .tabbar-item{
-    color: rgba($color: #ffffff, $alpha: 0.4);
+    color: rgba(255,255,255,0.4);
     font-size: 36px;
     line-height: 36px;
-    // padding-top: 25px;
     display: flex;
     flex: 1;
     align-items: center;

src/components/navigation/TabBar.tsx

@@ -1,5 +1,5 @@
 import { View, Text } from '@tarojs/components'
-import './Tabbar.scss'
+import './TabBar.scss'
 import Taro from '@tarojs/taro';
 import { useState } from 'react';
 import { useSelector } from 'react-redux';
@@ -8,6 +8,7 @@ import { ColorType } from '@/context/themes/color';
 export default function Component(props: { index: number }) {
     const common = useSelector((state: any) => state.common);
     const [selIndex] = useState(props.index)
+    console.log('tabbar')
     function switchTab(index: number) {
         switch (index) {
             case 0:

src/components/view/Tooltip.scss

@@ -1,3 +1,5 @@
+
+/* #ifdef weapp */
 .tip_bg {
     z-index: 1000;
     // display: flex;
@@ -14,6 +16,12 @@
 
 }
 
+/* #endif */
+
+/* #ifdef rn */
+
+/* #endif */
+
 .arrow {
     position: absolute;
     // width: 40px;

src/custom-tab-bar2/index.scss

@@ -1,4 +1,5 @@
 
+/* #ifdef weapp */
 .tabbar{
     display: flex;
     position: fixed;
@@ -20,6 +21,12 @@
     z-index: 100;
 }
 
+/* #endif */
+
+/* #ifdef rn */
+
+/* #endif */
+
 //未选中 18 40%
 //选中 20 100%
 

src/pages/clock/Clock.rn.tsx

@@ -39,7 +39,6 @@ import { TimeFormatter } from '@/utils/time_format'
 import NoData from '@/components/view/NoData'
 import { ColorType } from '@/context/themes/color'
 import { jumpPage } from '@/features/trackTimeDuration/hooks/Common'
-import DemoA from './demoA'
 import { ScrollView } from 'react-native-gesture-handler'
 // import TabBar from '../../components/Tabbar';
 

src/pages/clock/Clock.scss

@@ -1,49 +1,57 @@
-.console_box{
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    margin: 20px;
-    padding-top: 40px;
-    padding-bottom: 40px;
-    color: #fff;
-    // margin-bottom: 12px;
-    background-color: #1c1c1c;
-    border-radius: 40px;
-  }
-
-  .popDemo{
-    position: fixed;
-    top: 0;
-    left: 0;
-    z-index: 100000;
-    width: 100%;
-    height: 100%;
-    overflow: hidden;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    background-color: rgba($color: #000000, $alpha: 0.5);
-  }
-  .clock_bg{
-    width: 578px;
-    height: 578px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-  }
-
-  .swiper{
-    height: 360px;
-  }
-
-  .console_bg{
-    height: 360px;
-    overflow: hidden;
-    margin-bottom: 24px;
-  }
-
-  .swiperItem{
-    // height: 300px !important;
-    // height: auto !important;
-    // overflow: visible !important;
-  }
+/* #ifdef weapp */
+.console_box {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  margin: 20px;
+  padding-top: 40px;
+  padding-bottom: 40px;
+  color: #fff;
+  // margin-bottom: 12px;
+  background-color: #1c1c1c;
+  border-radius: 40px;
+}
+
+/* #endif */
+
+/* #ifdef rn */
+
+/* #endif */
+
+.popDemo {
+  position: fixed;
+  top: 0;
+  left: 0;
+  z-index: 100000;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background-color: rgba($color: #000000, $alpha: 0.5);
+}
+
+.clock_bg {
+  width: 578px;
+  height: 578px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.swiper {
+  height: 360px;
+}
+
+.console_bg {
+  height: 360px;
+  overflow: hidden;
+  margin-bottom: 24px;
+}
+
+.swiperItem {
+  // height: 300px !important;
+  // height: auto !important;
+  // overflow: visible !important;
+}

src/pages/rn/RNMain.tsx

@@ -3,7 +3,7 @@ import { NavigationContainer } from '@react-navigation/native';
 import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
 import { createStackNavigator } from '@react-navigation/stack';
 
-import Clock from '../clock/Clock'
+import Clock from '../clock/Clock.rn'
 import Metric from '../metric/Metric'
 import Activity from '../activity/Activity'
 import Profile from '../account/Profile'