chore: bump query-string to ^8.1.0 and update jest config (#2319)

* chore: upgrade query-string to ^8.1.0

* chore: update jest config

* style: update import

* style: update

---------

Co-authored-by: liuyib <1656081615@qq.com>

config/config.ts

@@ -9,6 +9,8 @@ export default {
     type: 'none',
     exclude: [],
   },
+  // https://github.com/alibaba/hooks/issues/2155
+  extraBabelIncludes: ['filter-obj'],
   extraBabelPlugins: [
     [
       'babel-plugin-import',

jest.config.js

@@ -1,3 +1,12 @@
+/** esm modules to transform */
+const esmModules = [
+  // `query-string` and its related dependencies
+  'query-string',
+  'decode-uri-component',
+  'split-on-first',
+  'filter-obj',
+];
+
 module.exports = {
   preset: 'ts-jest/presets/js-with-ts',
   testEnvironment: 'jsdom',
@@ -18,7 +27,7 @@ module.exports = {
     '!**/lib/**',
     '!**/dist/**',
   ],
-  transformIgnorePatterns: ['^.+\\.js$'],
+  transformIgnorePatterns: [`node_modules/(?!(?:.pnpm/)?(${esmModules.join('|')}))`],
   moduleNameMapper: {
     'lodash-es': 'lodash',
   },

package.json

@@ -68,10 +68,10 @@
     "react-shadow": "^19.0.3",
     "rimraf": "^3.0.2",
     "surge": "^0.21.3",
-    "ts-jest": "^29.0.5",
+    "ts-jest": "^29.1.1",
     "typescript": "^5.1.3",
-    "webpack": "^4.43.0",
-    "webpack-cli": "^3.3.10",
+    "webpack": "^5.88.2",
+    "webpack-cli": "^5.1.4",
     "webpack-merge": "^4.2.2"
   },
   "commitlint": {

packages/use-url-state/package.json

@@ -34,7 +34,7 @@
   "dependencies": {
     "@babel/runtime": "^7.21.0",
     "ahooks": "^3.4.1",
-    "query-string": "^6.9.0",
+    "query-string": "^8.1.0",
     "tslib": "^2.4.1"
   },
   "gitHead": "11f6ad571bd365c95ecb9409ca3050cbbfc9b34a"

packages/use-url-state/src/index.ts

@@ -1,5 +1,5 @@
 import { useMemoizedFn, useUpdate } from 'ahooks';
-import { parse, stringify } from 'query-string';
+import qs from 'query-string';
 import type { ParseOptions, StringifyOptions } from 'query-string';
 import { useMemo, useRef } from 'react';
 import type * as React from 'react';
@@ -50,7 +50,7 @@ const useUrlState = <S extends UrlState = UrlState>(
   );
 
   const queryFromUrl = useMemo(() => {
-    return parse(location.search, mergedParseOptions);
+    return qs.parse(location.search, mergedParseOptions);
   }, [location.search]);
 
   const targetQuery: State = useMemo(
@@ -71,7 +71,7 @@ const useUrlState = <S extends UrlState = UrlState>(
       history[navigateMode](
         {
           hash: location.hash,
-          search: stringify({ ...queryFromUrl, ...newQuery }, mergedStringifyOptions) || '?',
+          search: qs.stringify({ ...queryFromUrl, ...newQuery }, mergedStringifyOptions) || '?',
         },
         location.state,
       );
@@ -80,7 +80,7 @@ const useUrlState = <S extends UrlState = UrlState>(
       navigate(
         {
           hash: location.hash,
-          search: stringify({ ...queryFromUrl, ...newQuery }, mergedStringifyOptions) || '?',
+          search: qs.stringify({ ...queryFromUrl, ...newQuery }, mergedStringifyOptions) || '?',
         },
         {
           replace: navigateMode === 'replace',