new 模板

.eslintignore

-# 忽略eslint校验路径，例如:
-# src/libs/@spark
\ No newline at end of file

.eslintrc.js

-module.exports = {
-  parser: '@babel/eslint-parser',
-  env: {
-    browser: true,
-    es6: true,
-    node: true,
-  },
-  globals: {
-    CFG: true,
-    wx: true,
-    FYGE: true,
-    SPARK_ESLINT_PLUGIN: true,
-    remScale: true,
-  },
-  plugins: ['html', 'react', '@spark/best-practices', '@spark/security'],
-  extends: ['eslint:recommended', 'plugin:react/recommended'],
-  settings: {
-    react: {
-      version: 'detect',
-    },
-  },
-  parserOptions: {
-    sourceType: 'module',
-    ecmaVersion: 7,
-    ecmaFeatures: {
-      experimentalObjectRestSpread: true,
-      jsx: true,
-    },
-    babelOptions: {
-      configFile: './node_modules/@spark/code-inspector/static/babel.config.js',
-    },
-  },
-  rules: {
-    'no-undef': 'error',
-    'no-unused-vars': ['error', { vars: 'all', args: 'after-used', argsIgnorePattern: '^_', varsIgnorePattern: '^_', ignoreRestSiblings: true }],
-    'no-dupe-keys': 'error',
-    'no-fallthrough': 'error',
-    'no-global-assign': 'error',
-    'no-implied-eval': 'error',
-    'no-self-assign': 'error',
-    'no-self-compare': 'error',
-    'no-sequences': 'error',
-    'no-unused-expressions': ['error', { allowShortCircuit: true, allowTernary: true, allowTaggedTemplates: true }],
-    'no-useless-escape': 'error',
-    'no-empty-pattern': 'error',
-    'no-empty-function': ['error', { allow: ['arrowFunctions', 'functions', 'methods'] }],
-    'no-var': 'error',
-    'no-dupe-class-members': 'error',
-    'no-unsafe-optional-chaining': 'error',
-    'no-const-assign': 'error',
-    'no-empty': ['error', { allowEmptyCatch: true }],
-    'prefer-const': 'warn',
-    'no-extra-boolean-cast': 'warn',
-    'no-mixed-spaces-and-tabs': 'warn',
-    'no-alert': 'warn',
-    'no-new-wrappers': 'warn',
-    'no-useless-concat': 'warn',
-    'no-useless-return': 'warn',
-    'prefer-promise-reject-errors': ['warn', { allowEmptyReject: true }],
-    'spaced-comment': 'warn',
-    'react/prop-types': 'off',
-    'react/display-name': 'off',
-    'react/jsx-pascal-case': 'error',
-    'jsx-quotes': 'warn',
-    // 'react/jsx-tag-spacing': 'error',
-    'react/require-resnder-return': 'error',
-    'semi': [1],
-    "prefer-rest-params": "off",
-  },
-  overrides: [
-    {
-      files: ['public/**/*.html'],
-      rules: {
-        'no-var': 'off',
-        '@spark/security/third-party-whitelist': 'error',
-        '@spark/best-practices/no-url-in-js': 'error',
-        '@spark/best-practices/no-arrow-function': 'error',
-        '@spark/best-practices/no-es6-variable-declaration': 'error',
-      },
-    },
-    {
-      files: ['src/**/*.{js,jsx}'],
-      rules: {
-        '@spark/best-practices/no-url-in-js': 'error',
-      },
-    },
-  ],
-};

.gitignore

@@ -8,7 +8,6 @@ pnpm-debug.log*
 lerna-debug.log*
 
 node_modules
-dist
 dist-ssr
 *.local
 
@@ -22,3 +21,6 @@ dist-ssr
 *.njsproj
 *.sln
 *.sw?
+
+dist/*/*
+!dist/index.html
\ No newline at end of file

config/.env.global

+UPLOAD_DIR=TNGD_GAMES/B_Client
\ No newline at end of file

config/.env.production

+
+# .env.production
+CDN_DOMAIN=//gamification-sbx.tngdigital.com.my
+OSS_REGION=oss-ap-southeast-3
+OSS_BUCKET=sbx-gamification-tngd
+OSS_ACCESS_KEY_ID=LTAI5tApBGwYWaj6zLmKUaTJ
+OSS_ACCESS_SECRET=W3OvCDpbE3ywMaQnTNWzySnhPRK1We
\ No newline at end of file

plugins/DuibaPublish/DuibaPublish.ts → config/DuibaPublish/DuibaPublish.ts

@@ -29,7 +29,7 @@ export default function DuibaPublish(options: IDuibaPublishOptions) {
     async closeBundle() {
       const autoUpload = new AutoUpload({
         dir: path.resolve("dist"),
-        originDir: `/${uploadDir}/`,
+        originDir: `/${uploadDir}/${buildVersion}/`,
         accessKeySecret, accessKeyId, bucket, region,
       });
 

eslint.config.js

@@ -19,8 +19,10 @@ export default tseslint.config(
     },
     rules: {
       ...reactHooks.configs.recommended.rules,
+      "@typescript-eslint/no-explicit-any": "off",
       "@typescript-eslint/no-unused-vars": "off",
       "@typescript-eslint/ban-ts-comment": "off",
+      "@typescript-eslint/no-unused-expressions": "off",
       "prefer-rest-params": "off",
       'react-refresh/only-export-components': [
         'warn',

package.json

@@ -19,7 +19,9 @@
     "@types/crypto-js": "^4.2.2",
     "@types/node": "^22.5.1",
     "ali-oss": "^6.21.0",
+    "chalk": "^5.3.0",
     "crypto-js": "^4.2.0",
+    "dotenv": "^16.4.5",
     "duiba-utils": "^2.0.2",
     "less": "^4.2.0",
     "mobx": "^6.13.1",
@@ -47,9 +49,9 @@
     "mockjs": "^1.1.0",
     "postcss-pxtorem": "^6.1.0",
     "terser": "^5.31.6",
-    "typescript": "^5.5.3",
+    "typescript": "5.5.4",
     "typescript-eslint": "^8.0.1",
-    "vite": "^5.4.1",
+    "vite": "5.4.2",
     "vite-plugin-mock": "^3.0.2"
   }
 }

src/App.tsx

@@ -23,6 +23,8 @@ class App extends Component {
 
   async componentDidMount() {
     await store.getFrontVariable();
+
+    console.log(import.meta.glob("./assets/**/*"));
   }
 
   render() {

tsconfig.app.json

 {
   "compilerOptions": {
     "target": "ES2020",
-    "useDefineForClassFields": true,
     "module": "ESNext",
     "lib": ["ES2020", "DOM", "DOM.Iterable"],
+    "useDefineForClassFields": true,
     "skipLibCheck": true,
     "experimentalDecorators": true,
     /* Bundler mode */
@@ -17,9 +17,10 @@
 
     /* Linting */
     "strict": false,
+    "noImplicitAny": false,
     "noUnusedLocals": false,
     "noUnusedParameters": false,
-    "noFallthroughCasesInSwitch": false
+    "noFallthroughCasesInSwitch": true
   },
   "include": ["src"]
 }

tsconfig.node.json

 {
   "compilerOptions": {
     "target": "ES2022",
-    "lib": [
-      "ES2023"
-    ],
     "module": "ESNext",
+    "lib": ["ES2023"],
+    "useDefineForClassFields": true,
     "skipLibCheck": true,
+    "experimentalDecorators": true,
     /* Bundler mode */
     "moduleResolution": "bundler",
     "allowImportingTsExtensions": true,
@@ -14,6 +14,7 @@
     "noEmit": true,
     /* Linting */
     "strict": false,
+    "noImplicitAny": false,
     "noUnusedLocals": false,
     "noUnusedParameters": false,
     "noFallthroughCasesInSwitch": true

vite.config.ts

 import { defineConfig } from 'vite'
 import react from '@vitejs/plugin-react'
 import legacy from '@vitejs/plugin-legacy'
-
 import autoprefixer from "autoprefixer"
 import postcsspxtorem from "postcss-pxtorem"
 import { viteMockServe } from "vite-plugin-mock";
-import DuibaPublish from "./plugins/DuibaPublish/DuibaPublish.ts";
+import DuibaPublish from "./config/DuibaPublish/DuibaPublish.ts";
+
 
-const isProd = process.env.NODE_ENV == "production";
+import dotenv from 'dotenv';
 
-const versionStamp = Date.now();
+// https://vitejs.dev/config/
+export default defineConfig(({mode}) => {
 
-const origin = "//yun.duiba.com.cn";
+      dotenv.config({path: [`./config/.env.global`, `./config/.env.${mode}`]});
 
-const uploadDir = `db_games/spark_template/${versionStamp}`;
+      const {
+        NODE_ENV,
+        UPLOAD_DIR, CDN_DOMAIN,
+        OSS_REGION, OSS_BUCKET,
+        OSS_ACCESS_KEY_ID, OSS_ACCESS_SECRET,
+      } = process.env;
 
-const prodBase = `${origin}/${uploadDir}/`;
+      console.log(UPLOAD_DIR, NODE_ENV, CDN_DOMAIN, OSS_REGION, OSS_BUCKET, OSS_ACCESS_KEY_ID, OSS_ACCESS_SECRET)
 
-// https://vitejs.dev/config/
-export default defineConfig({
-  base: isProd ? prodBase : "",
-  plugins: [
-    react({
-      babel: {
+      const isDev = NODE_ENV == "development";
+
+      const versionStamp = Date.now();
+
+      const prodBase = `${CDN_DOMAIN}/${UPLOAD_DIR}/${versionStamp}/`;
+
+      return {
+        base: !isDev ? prodBase : "",
+        server: {
+          // port: 3001
+        },
         plugins: [
-          ["@babel/plugin-proposal-decorators", {legacy: true}],
-          ["@babel/plugin-proposal-class-properties", {loose: true}],
+          react({
+            babel: {
+              plugins: [
+                ["@babel/plugin-proposal-decorators", {legacy: true}],
+                ["@babel/plugin-proposal-class-properties", {loose: true}],
+              ],
+            },
+          }),
+          legacy({
+            targets: ['defaults', 'not IE 11'],
+          }),
+          viteMockServe({
+            // default
+            mockPath: 'mock',
+            enable: true,
+          }),
+          !isDev && DuibaPublish({
+            buildVersion: versionStamp,
+            uploadDir: UPLOAD_DIR,
+            region: OSS_REGION,
+            bucket: OSS_BUCKET,
+            accessKeyId: OSS_ACCESS_KEY_ID,
+            accessKeySecret: OSS_ACCESS_SECRET,
+          }),
         ],
-      },
-    }),
-    legacy({
-      targets: ['defaults', 'not IE 11'],
-    }),
-    viteMockServe({
-      // default
-      mockPath: 'mock',
-      enable: true,
-    }),
-    isProd && DuibaPublish({
-      buildVersion: versionStamp,
-      uploadDir: uploadDir,
-      region: "oss-cn-hangzhou",
-      bucket: "duiba",
-      accessKeyId: "LTAI5tPUSSxgkEmKPAfVXUQQ",
-      accessKeySecret: "6sk3EDd1BYrXlAUoh8maMuN7hOMkh1",
-    }),
-  ],
-  css: {
-    postcss: {
-      plugins: [
-        autoprefixer({
-          overrideBrowserslist: [
-            "Android 4.1",
-            "iOS 7.1",
-            "Chrome > 31",
-            "ff > 31",
-            "ie >= 8",
-            "last 10 versions", // 所有主流浏览器最近10版本用
-          ],
-          grid: true
-        }),
-        postcsspxtorem({
-          rootValue: 100,
-          propList: ["*", "!border"], // 除 border 外所有px 转 rem
-          selectorBlackList: [".el-"], // 过滤掉.el-开头的class，不进行rem转换
-        }),
-      ],
-    },
-    preprocessorOptions: {
-      less: {
-        javascriptEnabled: true,
-      },
-    },
-    modules: {
-      localsConvention: 'camelCase'
+        css: {
+          postcss: {
+            plugins: [
+              autoprefixer({
+                overrideBrowserslist: [
+                  "Android 4.1",
+                  "iOS 7.1",
+                  "Chrome > 31",
+                  "ff > 31",
+                  "ie >= 8",
+                  "last 10 versions", // 所有主流浏览器最近10版本用
+                ],
+                grid: true
+              }),
+              postcsspxtorem({
+                rootValue: 100,
+                // propList: ["*", "!border"], // 除 border 外所有px 转 rem
+                selectorBlackList: [".noRem-"], // 过滤掉.noRem-开头的class，不进行rem转换
+              }),
+            ],
+          },
+          preprocessorOptions: {
+            less: {
+              javascriptEnabled: true,
+            },
+          },
+          modules: {
+            localsConvention: 'camelCase'
+          }
+        }
+      }
     }
-  }
-})
+)