refactor: 架构升级

2026-09-12 16:40:40 +08:00 · 2026-08-31 07:58:23 +08:00
commit ba5b77568b
693 changed files with 118430 additions and 0 deletions
@@ -0,0 +1,100 @@
+# Build Optimization
+
+## 构建优化
+
+优化 UniApp + uCharts 项目的构建和性能。
+
+### 代码分割
+
+使用条件编译减少代码体积：
+
+```vue
+<template>
+  <view>
+    <!-- #ifdef H5 -->
+    <qiun-data-charts type="line" :opts="opts" :chartData="chartData" />
+    <!-- #endif -->
+    
+    <!-- #ifdef MP-WEIXIN -->
+    <qiun-data-charts type="bar" :opts="opts" :chartData="chartData" />
+    <!-- #endif -->
+  </view>
+</template>
+```
+
+### 组件按需引入
+
+虽然 easycom 会自动引入，但可以优化：
+
+```json
+{
+  "easycom": {
+    "autoscan": true,
+    "custom": {
+      "qiun-data-charts": "@/uni_modules/qiun-data-charts/components/qiun-data-charts/qiun-data-charts.vue"
+    }
+  }
+}
+```
+
+### 图表数据优化
+
+```vue
+<script>
+export default {
+  data() {
+    return {
+      chartData: {},
+      opts: {
+        // 优化配置
+        enableScroll: false,
+        dataLabel: false,
+        legend: {
+          show: false
+        }
+      }
+    }
+  },
+  methods: {
+    // 数据采样，减少数据量
+    sampleData(data, maxPoints = 100) {
+      if (data.length <= maxPoints) {
+        return data
+      }
+      const step = Math.ceil(data.length / maxPoints)
+      return data.filter((_, index) => index % step === 0)
+    }
+  }
+}
+</script>
+```
+
+### 打包配置
+
+在 manifest.json 中配置打包选项：
+
+```json
+{
+  "mp-weixin": {
+    "setting": {
+      "minified": true,
+      "postcss": true
+    }
+  },
+  "h5": {
+    "optimization": {
+      "treeShaking": {
+        "enable": true
+      }
+    }
+  }
+}
+```
+
+### 注意事项
+
+1. **条件编译**：使用条件编译减少代码体积
+2. **数据优化**：合理控制数据量，避免过大
+3. **配置优化**：合理配置图表选项，提高性能
+4. **打包配置**：正确配置打包选项
+5. **性能测试**：在不同平台测试性能
@@ -0,0 +1,117 @@
+# Custom Theme
+
+## 自定义主题
+
+在 UniApp 项目中自定义 uCharts 主题。
+
+### 配置主题颜色
+
+在图表配置中设置主题颜色：
+
+```vue
+<template>
+  <view>
+    <qiun-data-charts 
+      type="line"
+      :opts="opts"
+      :chartData="chartData"
+    />
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      chartData: {
+        categories: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri'],
+        series: [{
+          name: '数据',
+          data: [120, 200, 150, 80, 70]
+        }]
+      },
+      opts: {
+        color: ['#409EFF', '#67C23A', '#E6A23C', '#F56C6C'],
+        padding: [15, 15, 0, 15],
+        enableScroll: false,
+        legend: {
+          show: true
+        }
+      }
+    }
+  }
+}
+</script>
+```
+
+### 使用 SCSS 变量
+
+在 `uni.scss` 中定义主题变量：
+
+```scss
+/* uni.scss */
+$chart-primary-color: #409EFF;
+$chart-success-color: #67C23A;
+$chart-warning-color: #E6A23C;
+$chart-error-color: #F56C6C;
+```
+
+在组件中使用：
+
+```vue
+<script>
+export default {
+  data() {
+    return {
+      opts: {
+        color: [
+          '#409EFF', // 使用主题变量
+          '#67C23A',
+          '#E6A23C',
+          '#F56C6C'
+        ]
+      }
+    }
+  }
+}
+</script>
+```
+
+### 条件编译主题
+
+不同平台可以使用不同主题：
+
+```vue
+<script>
+export default {
+  data() {
+    return {
+      opts: {
+        // #ifdef H5
+        color: ['#409EFF', '#67C23A'],
+        // #endif
+        
+        // #ifdef MP-WEIXIN
+        color: ['#07c160', '#ff976a'],
+        // #endif
+        
+        // #ifdef APP-PLUS
+        color: ['#007AFF', '#34C759'],
+        // #endif
+        
+        padding: [15, 15, 0, 15],
+        enableScroll: false
+      }
+    }
+  }
+}
+</script>
+```
+
+### 注意事项
+
+1. **颜色配置**：使用合理的颜色搭配
+2. **平台差异**：使用条件编译处理平台差异
+3. **主题一致性**：保持应用主题一致性
+4. **可读性**：确保图表颜色具有良好的可读性
+5. **测试验证**：在不同平台测试主题效果
@@ -0,0 +1,105 @@
+# Multi-Platform Deployment
+
+## 多平台部署
+
+UniApp + uCharts 项目支持多平台部署的策略和注意事项。
+
+### 平台差异处理
+
+使用条件编译处理平台差异：
+
+```vue
+<template>
+  <view>
+    <!-- #ifdef H5 -->
+    <view>H5 平台内容</view>
+    <!-- #endif -->
+    
+    <!-- #ifdef MP-WEIXIN -->
+    <view>微信小程序内容</view>
+    <!-- #endif -->
+    
+    <!-- #ifdef APP-PLUS -->
+    <view>App 平台内容</view>
+    <!-- #endif -->
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      opts: {
+        // #ifdef H5
+        // H5 平台配置
+        enableScroll: true,
+        // #endif
+        
+        // #ifdef MP-WEIXIN
+        // 微信小程序配置
+        enableScroll: false,
+        // #endif
+        
+        // #ifdef APP-PLUS
+        // App 平台配置
+        enableScroll: false,
+        // #endif
+        
+        color: ['#409EFF'],
+        padding: [15, 15, 0, 15]
+      }
+    }
+  }
+}
+</script>
+```
+
+### 统一 API 封装
+
+封装统一的 API 调用：
+
+```javascript
+// utils/api.js
+export function request(url, options = {}) {
+  return new Promise((resolve, reject) => {
+    uni.request({
+      url,
+      ...options,
+      success: (res) => {
+        resolve(res.data)
+      },
+      fail: (err) => {
+        reject(err)
+      }
+    })
+  })
+}
+```
+
+### 平台特定配置
+
+在 manifest.json 中配置各平台：
+
+```json
+{
+  "h5": {
+    "router": {
+      "mode": "hash"
+    }
+  },
+  "mp-weixin": {
+    "appid": "your-appid"
+  },
+  "app-plus": {
+    "usingComponents": true
+  }
+}
+```
+
+### 注意事项
+
+1. **条件编译**：使用条件编译处理平台差异
+2. **API 统一**：封装统一的 API 调用
+3. **配置管理**：正确配置各平台参数
+4. **测试验证**：在各平台测试功能
+5. **文档记录**：记录平台差异和注意事项