upgrade 7.0.1 incompatible

[Raywh]

"@ant-design/colors": "^7.0.0",
"@ctrl/tinycolor": "^3.6.0",

upgrade 7.0.1

"@ant-design/colors": "^7.0.1",
"@ctrl/tinycolor": "^3.6.0",

error info

PS E:\project\customer-broadcast-web-lite> npm run dev

jumpy.ai-vue-web@4.0.01 dev
cross-env ENV=dev vue-cli-service serve

Browserslist: caniuse-lite is outdated. Please run:
npx browserslist@latest --update-db
Why you should do it regularly: https://github.com/browserslist/browserslist#browsers-data-updating
INFO Starting development server...
98% after emitting CopyPlugin

ERROR Failed to compile with 2 errors 14:46:03

error in ./node_modules/@ant-design/colors/node_modules/@ctrl/tinycolor/dist/module/index.js

Module parse failed: Unexpected token (23:35)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
| this.a = rgb.a;
| this.roundA = Math.round(100 * this.a) / 100;

    this.format = opts.format ?? rgb.format;

| this.gradientType = opts.gradientType;
| // Don't let the range of [0,255] come back in [0,1].

@ ./node_modules/@ant-design/colors/node_modules/@ctrl/tinycolor/dist/module/public_api.js 1:0-27 1:0-27
@ ./node_modules/@ant-design/colors/es/generate.js
@ ./node_modules/@ant-design/colors/es/index.js
@ ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/App.vue?vue&type=script&lang=js&
@ ./src/App.vue?vue&type=script&lang=js&
@ ./src/App.vue
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://192.168.1.219:9710&sockPath=/sockjs-node (webpack)/hot/dev-server.js ./src/main.js

error in ./node_modules/@ant-design/colors/node_modules/@ctrl/tinycolor/dist/module/readability.js

Module parse failed: Unexpected token (31:26)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
| export function isReadable(color1, color2, wcag2 = { level: 'AA', size: 'small' }) {
| const readabilityLevel = readability(color1, color2);

switch ((wcag2.level ?? 'AA') + (wcag2.size ?? 'small')) {

| case 'AAsmall':
| case 'AAAlarge':

@ ./node_modules/@ant-design/colors/node_modules/@ctrl/tinycolor/dist/module/public_api.js 3:0-33 3:0-33
@ ./node_modules/@ant-design/colors/es/generate.js
@ ./node_modules/@ant-design/colors/es/index.js
@ ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/App.vue?vue&type=script&lang=js&
@ ./src/App.vue?vue&type=script&lang=js&
@ ./src/App.vue
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://192.168.1.219:9710&sockPath=/sockjs-node (webpack)/hot/dev-server.js ./src/main.js