优化 小程序和ui

tixwork-taro/.env.dev

@@ -0,0 +1,2 @@
+# 配置文档参考 https://taro-docs.jd.com/docs/next/env-mode-config
+# TARO_APP_ID="开发环境下的小程序appid"

tixwork-taro/.env.prod

@@ -0,0 +1 @@
+# TARO_APP_ID="生产环境下的小程序appid"

tixwork-taro/.env.test

@@ -0,0 +1 @@
+# TARO_APP_ID="测试环境下的小程序appid"

tixwork-taro/.eslintrc.js

@@ -6,8 +6,6 @@ module.exports ={
     "import/first": "off",
     "jsx-quotes": "off",
     "react/sort-comp": [0],
-    "react/jsx-uses-react": "off",
-    "react/react-in-jsx-scope": "off",
     "no-shadow": "off",
     "react/jsx-curly-brace-presence": "off"
   }

tixwork-taro/.gitignore

@@ -7,5 +7,6 @@ node_modules/
 .DS_Store
 .idea
 deploy_versions/
+.swc
 
 

tixwork-taro/config/dev.ts

@@ -0,0 +1,9 @@
+import type { UserConfigExport } from "@tarojs/cli";
+export default {
+  logger: {
+    quiet: false,
+    stats: true
+  },
+  mini: {},
+  h5: {}
+} satisfies UserConfigExport

tixwork-taro/config/index.ts

@@ -0,0 +1,166 @@
+// eslint-disable-next-line import/no-commonjs
+import { defineConfig, type UserConfigExport } from '@tarojs/cli';
+import TsconfigPathsPlugin from 'tsconfig-paths-webpack-plugin';
+import devConfig from './dev';
+import prodConfig from './prod';
+import path from 'path';
+
+// https://taro-docs.jd.com/docs/next/config#defineconfig-辅助函数
+// @ts-ignore
+export default defineConfig(async (merge, { command, mode }) => {
+  const baseConfig: UserConfigExport = {
+    projectName: 'tixwork-taro',
+    date: '2022-5-25',
+    designWidth: 750,
+    deviceRatio: {
+      640: 2.34 / 2,
+      750: 1,
+      375: 2,
+      828: 1.81 / 2,
+    },
+    sourceRoot: 'src',
+    outputRoot: 'dist',
+    plugins: [],
+    defineConstants: {},
+    copy: {
+      patterns: [],
+      options: {},
+    },
+    framework: 'react',
+    compiler: 'webpack5',
+    cache: {
+      enable: false, // Webpack 持久化缓存配置，建议开启。默认配置请参考：https://docs.taro.zone/docs/config-detail#cache
+    },
+    alias: {
+      '@/http': path.resolve(__dirname, '..', 'src/http'),
+      '@/model': path.resolve(__dirname, '..', 'src/model'),
+      '@/components': path.resolve(__dirname, '..', 'src/components'),
+      '@/utils': path.resolve(__dirname, '..', 'src/utils'),
+      '@/service': path.resolve(__dirname, '..', 'src/service'),
+      '@/nice-router': path.resolve(__dirname, '..', 'src/nice-router'),
+      '@/genericpage': path.resolve(__dirname, '..', 'src/genericpage'),
+      '@/genericform': path.resolve(__dirname, '..', 'src/genericform'),
+      '@/server-image': path.resolve(__dirname, '..', 'src/server-image'),
+      '@/listof': path.resolve(__dirname, '..', 'src/listof'),
+
+    },
+    mini: {
+      miniCssExtractPluginOption: {
+        ignoreOrder: true,
+      },
+      postcss: {
+        pxtransform: {
+          enable: true,
+          config: {},
+        },
+        url: {
+          enable: true,
+          config: {
+            limit: 40240, // 设定转换尺寸上限
+          },
+        },
+        cssModules: {
+          enable: true, // 默认为 false，如需使用 css modules 功能，则设为 true
+          config: {
+            namingPattern: 'module', // 转换模式，取值为 global/module
+            generateScopedName: '[name]__[local]___[hash:base64:5]',
+          },
+        },
+      },
+      webpackChain(chain) {
+        chain.resolve.plugin('tsconfig-paths').use(TsconfigPathsPlugin);
+        // chain.plugin('analyzer')
+        //   .use(require('webpack-bundle-analyzer').BundleAnalyzerPlugin, [])
+
+        //lodash 瘦身配置
+        // 奇怪行为，需要设置这个https://www.npmjs.com/package/lodash-webpack-plugin
+        // 也可以移除一些，用来瘦身，目前发现shorthands，coercions，paths是必须的，否则会很诡异
+        chain.plugin('lodash-webpack-plugin')
+          .use(require('lodash-webpack-plugin'), [
+            {
+              shorthands: true,
+              cloning: true,
+              caching: true,
+              collections: true,
+              exotics: true,
+              guards: true,
+              memoizing: true,
+              coercions: true,
+              flattening: true,
+              paths: true,
+            }]);
+
+        // 将 lodash 单独拆分出来 (防止vendors.js过大)
+        chain.merge({
+          optimization: {
+            splitChunks: {
+              cacheGroups: {
+                lodash: {
+                  name: 'lodash',
+                  priority: 1000,
+                  test(module) {
+                    return /node_modules[\\/]lodash/.test(module.context);
+                  },
+                },
+              },
+            },
+          },
+        });
+      },
+      commonChunks(commonChunks) { // 添加 lodash 公共文件
+        commonChunks.push('lodash');
+        return commonChunks;
+      },
+    },
+    h5: {
+      publicPath: '/',
+      staticDirectory: 'static',
+      router: {
+        mode: 'browser', // 或者是 'hash'
+      },
+      output: {
+        filename: 'js/[name].[hash:8].js',
+        chunkFilename: 'js/[name].[chunkhash:8].js',
+      },
+      imageUrlLoaderOption: {
+        limit: 5000,
+        name: 'static/images/[name].[hash].[ext]',
+      },
+      miniCssExtractPluginOption: {
+        ignoreOrder: true,
+        filename: 'css/[name].[hash].css',
+        chunkFilename: 'css/[name].[chunkhash].css',
+      },
+      postcss: {
+        autoprefixer: {
+          enable: true,
+          config: {},
+        },
+        cssModules: {
+          enable: true, // 默认为 false，如需使用 css modules 功能，则设为 true
+          config: {
+            namingPattern: 'module', // 转换模式，取值为 global/module
+            generateScopedName: '[name]__[local]___[hash:base64:5]',
+          },
+        },
+      },
+      webpackChain(chain) {
+        chain.resolve.plugin('tsconfig-paths').use(TsconfigPathsPlugin);
+      },
+    },
+    rn: {
+      appName: 'TixworkRN',
+      postcss: {
+        cssModules: {
+          enable: false, // 默认为 false，如需使用 css modules 功能，则设为 true
+        },
+      },
+    },
+  };
+  if (process.env.NODE_ENV === 'development') {
+    // 本地开发构建配置（不混淆压缩）
+    return merge({}, baseConfig, devConfig);
+  }
+  // 生产构建配置（默认开启压缩混淆等）
+  return merge({}, baseConfig, prodConfig);
+});