本地缓存不支持title自定义

[AiTingT]

保存拖拽宽度至本地localStorage，如果title自定义非字符串，如多语言，就会出现保存报错

[hemengke1997]

请贴一下核心代码

[AiTingT]

const columns: any[] = [
{
title: intl.formatMessage({ id: 'order.Booknumber' }),
dataIndex: 'putrecNo',
width: 150,
key: 'putrecNo',
ellipsis: true,
search: false,
},
{
title: intl.formatMessage({ id: 'common.list.Creationtime' }),
dataIndex: 'createTime',
key: 'createTime',
valueType: 'dateRange',
hideInTable: true,
},
]

const { components, resizableColumns, tableWidth } = useAntdResizableHeader({
columns: useMemo(() => columns, []),
columnsState: {
persistenceKey: 'localKey',
persistenceType: 'localStorage',
},
onResizeEnd: (col) => {
console.log(col);
},
});
类似这种，title如果自定义或者react多语言，就会出现报错，
可以在缓存本地的时候不保存titile字段吗

[hemengke1997]

你好
title 字段支持 React.ReactNode。如：

title: <div>this is title</div>

[hemengke1997]

fixed in 2.8.8

[AiTingT]

你好，升级到2.8.8，启动时报错
devScripts.js:6523 [@umijs/runtime] load component failed Error: Module build failed (from ./node_modules/@umijs/bundler-webpack/lib/webpack/plugins/mini-css-extract-plugin/src/loader.js):
ModuleNotFoundError: Module not found: Error: Can't resolve './react-resizable/css/styles.css' in '/Users/zt/Desktop/cdsp-jusda-web/cdsp-jusda-admin-ui-react/node_modules/@minko-fe/use-antd-resizable-header/dist'
at Users/zt/Desktop/cdsp-jusda-web/cdsp-jusda-admin-ui-react/node_modules/@umijs/deps/compiled/webpack/5/bundle5.js:92691:28
at Users/zt/Desktop/cdsp-jusda-web/cdsp-jusda-admin-ui-react/node_modules/@umijs/deps/compiled/webpack/5/bundle5.js:117155:13
at eval (eval at create (Users/zt/Desktop/cdsp-jusda-web/cdsp-jusda-admin-ui-react/node_modules/@umijs/deps/compiled/webpack/5/bundle5.js:50186:10), :10:1)
at Users/zt/Desktop/cdsp-jusda-web/cdsp-jusda-admin-ui-react/node_modules/@umijs/deps/compiled/webpack/5/bundle5.js:116697:22
at eval (eval at create (Users/zt/Desktop/cdsp-jusda-web/cdsp-jusda-admin-ui-react/node_modules/@umijs/deps/compiled/webpack/5/bundle5.js:50186:10), :9:1)
at Users/zt/Desktop/cdsp-jusda-web/cdsp-jusda-admin-ui-react/node_modules/@umijs/deps/compiled/webpack/5/bundle5.js:116826:22
at Users/zt/Desktop/cdsp-jusda-web/cdsp-jusda-admin-ui-react/node_modules/@umijs/deps/compiled/webpack/5/bundle5.js:116540:11
at Users/zt/Desktop/cdsp-jusda-web/cdsp-jusda-admin-ui-react/node_modules/@umijs/deps/compiled/webpack/5/bundle5.js:117071:24
at Users/zt/Desktop/cdsp-jusda-web/cdsp-jusda-admin-ui-react/node_modules/@umijs/deps/compiled/webpack/5/bundle5.js:117225:8
at Users/zt/Desktop/cdsp-jusda-web/cdsp-jusda-admin-ui-react/node_modules/@umijs/deps/compiled/webpack/5/bundle5.js:117345:5
at Users/zt/Desktop/cdsp-jusda-web/cdsp-jusda-admin-ui-react/node_modules/@umijs/deps/compiled/webpack/5/bundle5.js:42302:13
at Array. (Users/zt/Desktop/cdsp-jusda-web/cdsp-jusda-admin-ui-react/node_modules/@umijs/deps/compiled/webpack/5/bundle5.js:117320:14)
at arrayEachFunc (Users/zt/Desktop/cdsp-jusda-web/cdsp-jusda-admin-ui-react/node_modules/@umijs/deps/compiled/webpack/5/bundle5.js:37936:19)
at Object.parallel (Users/zt/Desktop/cdsp-jusda-web/cdsp-jusda-admin-ui-react/node_modules/@umijs/deps/compiled/webpack/5/bundle5.js:42277:9)
at NormalModuleFactory.resolveResourceErrorHints (Users/zt/Desktop/cdsp-jusda-web/cdsp-jusda-admin-ui-react/node_modules/@umijs/deps/compiled/webpack/5/bundle5.js:117243:12)
at Users/zt/Desktop/cdsp-jusda-web/cdsp-jusda-admin-ui-react/node_modules/@umijs/deps/compiled/webpack/5/bundle5.js:117204:18
at ./node_modules/@minko-fe/use-antd-resizable-header/dist/style.css (mf-dep_src_umi_cache_mfsu_mf-va__minko-fe_use-antd-resizable-header_dist_style_css_js.fb3307f6.async.js:9:7)
at webpack_require (mf-va_remoteEntry.js:23:42)
at ./src/.umi/.cache/.mfsu/mf-va@minko-fe_use-antd-resizable-header_dist_style.css.js (mf-dep_src_umi_cache_mfsu_mf-va__minko-fe_use-antd-resizable-header_dist_style_css_js.fb3307f6.async.js:21:108)
at webpack_require (mf-va_remoteEntry.js:23:42)
at mf-va_remoteEntry.js:689:167
at webpack_require.m. (remotes loading:1609:1)
at webpack_require (bootstrap:24:1)
at fn (hot module replacement:61:1)
at webpack_require.t (create fake namespace object:10:1)
at async index.tsx:44:1

[hemengke1997]

sorry，昨天重构了构建方式，css打包有点问题，已修复。fixed in 2.8.9

[AiTingT]

还是报错呢
filePath not found of @minko-fe/use-antd-resizable-header/index.css

[hemengke1997]

webpack？

[hemengke1997]

还是报错呢 filePath not found of @minko-fe/use-antd-resizable-header/index.css

你可以使用 import '@minko-fe/use-antd-resizable-header/dist/index.css'

[hemengke1997]

我用的vite，没有能复现这个问题。
此包导出的原理是 package.json 中的 exports 字段，自定义导出 ./index.css 指向 ./dist/index.css
所以我猜测是webpack没有去分析 exports 字段，我这边可能需要做一些打包兼容
但是我对webpack不熟悉，所以如果你乐意帮助的话，欢迎pr

[AiTingT]

是的，webpack，报错如下：
devScripts.js:6523 [@umijs/runtime] load component failed Error: Module "./@minko-fe/use-antd-resizable-header/dist/index.css" does not exist in container.
while loading "./@minko-fe/use-antd-resizable-header/dist/index.css" from webpack/container/reference/mf

我也不是很擅长这个

[hemengke1997]

是的，webpack，报错如下： devScripts.js:6523 [@umijs/runtime] load component failed Error: Module "./@minko-fe/use-antd-resizable-header/dist/index.css" does not exist in container. while loading "./@minko-fe/use-antd-resizable-header/dist/index.css" from webpack/container/reference/mf

"./@minko-fe/use-antd-resizable-header/dist/index.css" ===> "@minko-fe/use-antd-resizable-header/index.css"

不要前面的 ./

BTW，我本地使用umi，是正常的。

[AiTingT]

没有加 ./
我是这样引入的
import { useAntdResizableHeader } from '@minko-fe/use-antd-resizable-header';
import '@minko-fe/use-antd-resizable-header/dist/index.css';
好奇怪

[AiTingT]

我直接新建了个css文件，然后把样式导入进去，就好了

[AiTingT]

你好，resizeWidth不能传入百分比吗，现在好像是固定宽度，就会出现光标和实际table列不一致

[hemengke1997]

不支持百分比宽度