webpack配置域名

config/index.js

@@ -74,15 +74,21 @@ const config = {
     //   HOST: '"/api"'
     // },
     devServer: {
+      // host: 'nomad.hackrobot.cn', // 替换为您的域名
+      // port: 10086,            // 选择一个适当的端口号
       proxy: {
         '/api/': {
-          target: JSON.parse('"http://localhost:8055"'), //本地调试端口
+          target: JSON.parse('"http://localhost:8700"'), //本地调试端口
           pathRewrite: {
             '^/api/': '/'
           },
           changeOrigin: true
         }
-      }
+      },
+      // 允许特定域名访问
+      allowedHosts: [
+        'nomad.hackrobot.cn'
+      ],
     }
   },
 };

src/pages/index/index.jsx

@@ -144,7 +144,7 @@ const Index = () => {
           <br />
           副业是做跨境电商
           <br />
-          努力成为一个<span className="spanText">数字游民</span>ing😎
+          做一个<span className="spanText">数字游民</span>ing😎
         </View>
       </View>
 
@@ -185,6 +185,7 @@ const Index = () => {
       </View>
 
       {/* 在线图书 */}
+      {/* 参考资料https://readmake.com/ */}
       <View className="index-book">
         <View className="bookImg">
           <Image
@@ -199,10 +200,23 @@ const Index = () => {
               style="width: 30px;height:30px;background: #fff;"
               src={nomad}
             />
-            <View>数字游民</View>
+            <View className="bookNmae">数字游民</View>
+          </View>
+          <View className="subtitle">多元自动化收入</View>
+          <View className="bookText">
+            {/* 两个核心主题: <br /> */}
+            1. 微信运营:云手机+机器人+AIGC
+            <br />
+            2. 自媒体:youtube获利+wordpress <br />
+            3. 跨境电商:amazon<br />
+            4. 软件saas:独立开发<br />
+            5. 知识付费:如何出版一本书?<br />
+
+
+          </View>
+          <View className="bookPrice">
+            <View className="join">立即阅读</View>
           </View>
-          <View>222</View>
-          <View>333</View>
         </View>
       </View>
 
@@ -253,13 +267,14 @@ const Index = () => {
             {/* 右边 */}
             <View className="meetup-right">
               <View className="title">
-                xMEMS Live - Asia 2024 | 音频技术研讨会（深圳）
+                数字游民 | 自由职业者沙龙
               </View>
               <View className="address">
                 <AtIcon value="map-pin" size="30" color="#F00"></AtIcon>
-                <span>深圳市南山区</span>
+                <span>深圳市龙华区</span>
               </View>
               <View className="meetBtn">
+              <View ><AtIcon value="clock" size="30" color="#F00"></AtIcon>18:00--20:00</View>
                 <View className="join">了解详情</View>
               </View>
             </View>
@@ -316,6 +331,9 @@ const Index = () => {
           </AtModalAction>
         </AtModal>
       </View>
+
+      {/* 腾讯云推广: https://curl.qcloud.com/8bJ1d9U0 */}
+      {/* <View></View> */}
     </View>
   );
 };

src/pages/index/index.scss

@@ -61,7 +61,7 @@
       flex-direction: column;
       // align-items: center;
       justify-content: space-between;
-      background-color: yellow;
+      // background-color: yellow;
       // width: 100%;
       flex: 1;
       height: 100%;
@@ -73,7 +73,39 @@
         align-items: center;
         // justify-content: space-between;
         // background-color: red;
+        .bookNmae{
+          margin-left: 10px;
+
+        }
       }
+      .subtitle{
+        font-size: 20px;
+        color: red;
+      }
+      .bookText{
+        font-size: 20px;
+
+      }
+      .bookPrice{
+        font-size: 30px;
+        display: flex;
+        flex-direction: row-reverse;
+        .join {
+          font-size: 20px;
+          width: 100px;
+          display: flex;
+          flex-direction: row;
+          align-items: center;
+          justify-content: center;
+          background-color: #1bb14e;
+          color: #fff;
+          border-radius: 15%;
+          position: relative;
+          bottom: 10px;
+          right: 10px;
+        }
+      }
+
     }
   }
 
@@ -130,7 +162,11 @@
         }
         .meetBtn {
           display: flex;
-          flex-direction: row-reverse;
+          // flex-direction: row-reverse;
+          flex-direction: row;
+          align-items: center;
+          justify-content: space-between;
+
           .join {
             width: 100px;
             display: flex;