+ exported function refDeepClone() to fix `DOMException: Failed to …

…execute 'structuredClone' on 'Window': #<Object> could not be cloned.` @ shared/index.ts

@ fix violations of eslint rule `import-x/order` @ vite.config.ts

* explicitly set `languageOptions.parser` to `@typescript-eslint/parser`
* enable `parserOptions.EXPERIMENTAL_useProjectService` for `@typescript-eslint/parser`
* set `parserOptions.project` to `true` instead of explicitly passing two `tsconfig.*.json` paths
* fix `languageOptions.parserOptions.ecmaVersion` doesn't exists
@ eslint.config.js
@ fe

fe/eslint.config.js

@@ -530,6 +530,7 @@ import { FlatCompat } from '@eslint/eslintrc';
 import eslintJs from '@eslint/js';
 import pluginStylistic from '@stylistic/eslint-plugin';
 import pluginStylisticMigrate from '@stylistic/eslint-plugin-migrate';
+import * as typescriptESLintParser from '@typescript-eslint/parser';
 import pluginImportX from 'eslint-plugin-import-x';
 import pluginUnicorn from 'eslint-plugin-unicorn';
 // eslint-disable-next-line import-x/extensions
@@ -558,14 +559,16 @@ export default [
         'plugin:@tanstack/eslint-plugin-query/recommended', // https://github.com/TanStack/query/pull/7253
     )),
     pluginUnicorn.configs['flat/recommended'],
-    { languageOptions: { parserOptions: { ecmaVersion: 'latest' } } },
+    { languageOptions: { ecmaVersion: 'latest' } },
     { ignores: ['.yarn/', '.pnp.*'] },
     { linterOptions: { reportUnusedDisableDirectives: 'error' } },
     {
         languageOptions: {
+            parser: typescriptESLintParser,
             parserOptions: {
-                project: ['./tsconfig.json', './tsconfig.node.json'],
-                tsconfigRootDir: import.meta.dirname,
+                EXPERIMENTAL_useProjectService: true, // https://github.com/typescript-eslint/typescript-eslint/issues/2094
+                project: true, // https://typescript-eslint.io/blog/parser-options-project-true/
+                tsconfigRootDir: import.meta.dirname, // https://github.com/typescript-eslint/typescript-eslint/issues/251
             },
         },
         settings: {
@@ -595,8 +598,17 @@ export default [
             parser: vueESLintParser,
             parserOptions: {
                 parser: typescriptESLintParserForExtraFiles,
-                project: ['./tsconfig.json', './tsconfig.node.json'],
-                tsconfigRootDir: import.meta.dirname,
+                project: true, // https://typescript-eslint.io/blog/parser-options-project-true/
+                tsconfigRootDir: import.meta.dirname, // https://github.com/typescript-eslint/typescript-eslint/issues/251
+            },
+        },
+    },
+    {
+        files: ['vite.config.ts', 'eslint.config.js'],
+        languageOptions: {
+            parser: typescriptESLintParser,
+            parserOptions: {
+                project: ['./tsconfig.json', './tsconfig.node.json'], // https://typescript-eslint.io/blog/parser-options-project-true/
             },
         },
     },

fe/src/components/Post/queryForm/useQueryForm.ts

@@ -1,5 +1,5 @@
 import type { ObjUnknown, ObjValues } from '@/shared';
-import { boolStrToBool } from '@/shared';
+import { boolStrToBool, refDeepClone } from '@/shared';
 import type { RouteObjectRaw } from '@/stores/triggerRouteUpdate';
 import type { Ref } from 'vue';
 import { onBeforeMount, ref, watch } from 'vue';
@@ -39,7 +39,7 @@ const useQueryForm = <
         if (resetToDefault)
             return _.defaultsDeep(defaultParam, param) as T;
 
-        return _.defaultsDeep(structuredClone(param), defaultParam) as T;
+        return _.defaultsDeep(refDeepClone(param), defaultParam) as T;
     };
     const addParam = (name: string) => {
         params.value.push(fillParamDefaultValue({ name }));
@@ -64,7 +64,7 @@ const useQueryForm = <
         /** remove subParam.not: false, which previously added by {@link fillParamDefaultValue()} */
         if (defaultParam.subParam !== undefined)
             defaultParam.subParam.not ??= false;
-        const newParam: Partial<UnknownParam> = structuredClone(param); // prevent mutating origin param
+        const newParam: Partial<UnknownParam> = refDeepClone(param); // prevent mutating origin param
         /** number will consider as empty in {@link _.isEmpty()} */
         // to prevent this we use complex short circuit evaluate expression
         if (!(_.isNumber(newParam.value) || !_.isEmpty(newParam.value))

fe/src/components/Post/renderers/list/RendererList.vue

@@ -14,6 +14,7 @@ import type { ApiPosts } from '@/api/index.d';
 import type { Reply, SubReply, Thread } from '@/api/post';
 import { compareRouteIsNewQuery, setComponentCustomScrollBehaviour } from '@/router';
 import type { Modify } from '@/shared';
+import { refDeepClone } from '@/shared';
 import { initialTippy } from '@/shared/tippy';
 import type { ComputedRef } from 'vue';
 import { computed, onMounted, provide } from 'vue';
@@ -37,7 +38,7 @@ export type ThreadWithGroupedSubReplies<AdditionalSubReply extends SubReply = ne
     Thread & { replies: Array<Reply & { subReplies: Array<AdditionalSubReply | SubReply[]> }> };
 const posts = computed(() => {
     // https://github.com/microsoft/TypeScript/issues/33591
-    const newPosts = structuredClone(props.initialPosts) as
+    const newPosts = refDeepClone(props.initialPosts) as
         Modify<ApiPosts['response'], { threads: Array<ThreadWithGroupedSubReplies<SubReply>> }>;
     newPosts.threads = newPosts.threads.map(thread => {
         thread.replies = thread.replies.map(reply => {

fe/src/shared/index.ts

@@ -1,7 +1,7 @@
 import type { Cursor } from '@/api/index.d';
 import type { Reply, SubReply, Thread } from '@/api/post';
 import type { BaiduUserID, User } from '@/api/user';
-import { computed } from 'vue';
+import { computed, toRaw } from 'vue';
 import type { LocationAsRelativeRaw } from 'vue-router';
 import Noty from 'noty';
 import * as _ from 'lodash-es';
@@ -76,6 +76,9 @@ export const isElementNode = (node: Node): node is Element => node.nodeType ===
 export const undefinedOr = <T, TReturn>(value: T | undefined, transformer: (value: T) => TReturn): TReturn | undefined =>
     (value === undefined ? undefined : transformer(value));
 
+// https://stackoverflow.com/questions/71075490/how-to-make-a-structuredclone-of-a-proxy-object/77022014#77022014
+export const refDeepClone = <T>(value: T) => structuredClone(toRaw(value));
+
 // https://stackoverflow.com/questions/36532307/rem-px-in-javascript/42769683#42769683
 // https://gist.github.com/paulirish/5d52fb081b3570c81e3a#calling-getcomputedstyle
 export const convertRemToPixels = (rem: number) =>

fe/vite.config.ts

@@ -1,7 +1,7 @@
-import { visualizer } from 'rollup-plugin-visualizer';
-import { defineConfig } from 'vite';
 import vue from '@vitejs/plugin-vue';
 import vueJsx from '@vitejs/plugin-vue-jsx';
+import { visualizer } from 'rollup-plugin-visualizer';
+import { defineConfig } from 'vite';
 import { analyzer } from 'vite-bundle-analyzer';
 import { fileURLToPath } from 'node:url';