Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Errors on build with new dependency "react-use-set" #3168

Closed
daniel-dona opened this issue Apr 24, 2023 · 9 comments
Closed

Errors on build with new dependency "react-use-set" #3168

daniel-dona opened this issue Apr 24, 2023 · 9 comments
Assignees
@SevenOutman
Labels
Stale status: Needs More Info There's no enough information to understand or reproduce the issue topic: Build

Comments

@daniel-dona
Copy link

What version of rsuite are you using?

5.32.0

What version of React are you using?

18.2

What version of TypeScript are you using (if any)?

No response

What browser are you using?

Firefox, Chrome

Describe the Bug

Getting this errors when running npm run build

#0 115.6 ERROR in ./node_modules/react-use-set/dist/index.mjs 23:17-28
#0 115.6 Can't import the named export 'useCallback' from non EcmaScript module (only default export is available)
#0 115.6  @ ./node_modules/rsuite/esm/Cascader/Cascader.js
#0 115.6  @ ./node_modules/rsuite/esm/Cascader/index.js
#0 115.6  @ ./node_modules/rsuite/esm/index.js
#0 115.6  @ ./src/components/App/Main.js
#0 115.6  @ ./src/index.js
#0 115.6 
#0 115.6 ERROR in ./node_modules/react-use-set/dist/index.mjs 34:16-27
#0 115.6 Can't import the named export 'useCallback' from non EcmaScript module (only default export is available)
#0 115.6  @ ./node_modules/rsuite/esm/Cascader/Cascader.js
#0 115.6  @ ./node_modules/rsuite/esm/Cascader/index.js
#0 115.6  @ ./node_modules/rsuite/esm/index.js
#0 115.6  @ ./src/components/App/Main.js
#0 115.6  @ ./src/index.js
#0 115.6 
#0 115.6 ERROR in ./node_modules/react-use-set/dist/index.mjs 37:15-26
#0 115.6 Can't import the named export 'useCallback' from non EcmaScript module (only default export is available)
#0 115.6  @ ./node_modules/rsuite/esm/Cascader/Cascader.js
#0 115.6  @ ./node_modules/rsuite/esm/Cascader/index.js
#0 115.6  @ ./node_modules/rsuite/esm/index.js
#0 115.6  @ ./src/components/App/Main.js
#0 115.6  @ ./src/index.js
#0 115.6 
#0 115.6 ERROR in ./node_modules/react-use-set/dist/index.mjs 40:9-16
#0 115.6 Can't import the named export 'useMemo' from non EcmaScript module (only default export is available)
#0 115.6  @ ./node_modules/rsuite/esm/Cascader/Cascader.js
#0 115.6  @ ./node_modules/rsuite/esm/Cascader/index.js
#0 115.6  @ ./node_modules/rsuite/esm/index.js
#0 115.6  @ ./src/components/App/Main.js
#0 115.6  @ ./src/index.js

Expected Behavior

Build just fine

To Reproduce

Use rsuite version 5.32.0 in a react project, builds just fine with 5.31.1
@SevenOutman
Copy link
Member

It seems related to the webpack config. Please see if this solution helps.

@SevenOutman SevenOutman added status: Needs Triage New issues that has not been looked into status: Needs More Info There's no enough information to understand or reproduce the issue topic: Build and removed status: Needs Triage New issues that has not been looked into labels Apr 25, 2023
@Marina-Mascarenhas
Copy link

What version of rsuite are you using?

5.32.0

What version of React are you using?

18.2

What version of TypeScript are you using (if any)?

No response

What browser are you using?

Firefox, Chrome

Describe the Bug

Getting this errors when running npm run build

#0 115.6 ERROR in ./node_modules/react-use-set/dist/index.mjs 23:17-28
#0 115.6 Can't import the named export 'useCallback' from non EcmaScript module (only default export is available)
#0 115.6  @ ./node_modules/rsuite/esm/Cascader/Cascader.js
#0 115.6  @ ./node_modules/rsuite/esm/Cascader/index.js
#0 115.6  @ ./node_modules/rsuite/esm/index.js
#0 115.6  @ ./src/components/App/Main.js
#0 115.6  @ ./src/index.js
#0 115.6 
#0 115.6 ERROR in ./node_modules/react-use-set/dist/index.mjs 34:16-27
#0 115.6 Can't import the named export 'useCallback' from non EcmaScript module (only default export is available)
#0 115.6  @ ./node_modules/rsuite/esm/Cascader/Cascader.js
#0 115.6  @ ./node_modules/rsuite/esm/Cascader/index.js
#0 115.6  @ ./node_modules/rsuite/esm/index.js
#0 115.6  @ ./src/components/App/Main.js
#0 115.6  @ ./src/index.js
#0 115.6 
#0 115.6 ERROR in ./node_modules/react-use-set/dist/index.mjs 37:15-26
#0 115.6 Can't import the named export 'useCallback' from non EcmaScript module (only default export is available)
#0 115.6  @ ./node_modules/rsuite/esm/Cascader/Cascader.js
#0 115.6  @ ./node_modules/rsuite/esm/Cascader/index.js
#0 115.6  @ ./node_modules/rsuite/esm/index.js
#0 115.6  @ ./src/components/App/Main.js
#0 115.6  @ ./src/index.js
#0 115.6 
#0 115.6 ERROR in ./node_modules/react-use-set/dist/index.mjs 40:9-16
#0 115.6 Can't import the named export 'useMemo' from non EcmaScript module (only default export is available)
#0 115.6  @ ./node_modules/rsuite/esm/Cascader/Cascader.js
#0 115.6  @ ./node_modules/rsuite/esm/Cascader/index.js
#0 115.6  @ ./node_modules/rsuite/esm/index.js
#0 115.6  @ ./src/components/App/Main.js
#0 115.6  @ ./src/index.js

Expected Behavior

Build just fine

To Reproduce

Use rsuite version 5.32.0 in a react project, builds just fine with 5.31.1

I am using react 16+
react scripts 4.0.3
rsuite 5.32.0

I am having the same issue mentioned above on
npm start and npm build
Downgraded to 5.31.1 .Still the same issue

The version 4.11.1 works absolutely fine, but I am looking for DataTimeRange picker

@surongm
Copy link

surongm commented May 4, 2023

我这边也报了这个错，请问有在修复这个bug不~

@simonguo
Copy link
Member

simonguo commented May 6, 2023

@SevenOutman For developers using older versions of webpack, they may face issues with using .mjs files. Would it be worth considering changing from .mjs to .js?

@SevenOutman
Copy link
Member

@SevenOutman For developers using older versions of webpack, they may face issues with using .mjs files. Would it be worth considering changing from .mjs to .js?

I don't think it's too early to adopt .mjs today. Users should be able tweak their build system to support .mjs files with just little bit addtional configuration. For example, webpack seems to have been supporting .mjs extension since v4, which has been released for pretty long. And older webpack should be able to handle .mjs files with loaders.

But just for fixing this breaking updates, I would drop dependency on react-use-set and use an internal implementation of useSet. We may reduce support for legacy build systems in next major releases.

@SevenOutman
Copy link
Member

我这边也报了这个错，请问有在修复这个bug不~

@surongm 请问根据这条评论更新 webpack 配置是否可以解决问题？

@surongm
Copy link

surongm commented May 9, 2023

我这边也报了这个错，请问有在修复这个bug不~

@surongm 请问根据这条评论更新 webpack 配置是否可以解决问题？

我这边只用到了table组件
我使用rsuite-table可以正常构建，使用rsuite就会报上面的错（所以我现在直接使用rsuite-table了^^）
这两个组件有什么不一样的地方么？
链接说的方法到时候我再试一下~

@SevenOutman
Copy link
Member

SevenOutman commented May 10, 2023 •
edited

我这边只用到了table组件 我使用rsuite-table可以正常构建，使用rsuite就会报上面的错（所以我现在直接使用rsuite-table了^^） 这两个组件有什么不一样的地方么？
链接说的方法到时候我再试一下~

rsuite 导出的 Table 组件和 rsuite-table 并没有什么区别。只是 rsuite 中的其他模块依赖了一些使用 .mjs 扩展名的包，导致在较早版本的 webpack（不默认支持 .mjs 文件）中出现构建错误。链接介绍的方法即为为 webpack 添加配置使其支持 .mjs 文件。

/cc @simonguo 这引起了我的注意。如果 rsuite 对 tree-shaking 更加友好，也许 import { Table } from 'rsuite'; 可以不受 Table 以外的模块的影响？

@SevenOutman SevenOutman self-assigned this May 10, 2023
@VenkateshMogili
Copy link

What version of rsuite are you using?

5.32.0

What version of React are you using?

18.2

What version of TypeScript are you using (if any)?

No response

What browser are you using?

Firefox, Chrome

Describe the Bug

Getting this errors when running npm run build

#0 115.6 ERROR in ./node_modules/react-use-set/dist/index.mjs 23:17-28
#0 115.6 Can't import the named export 'useCallback' from non EcmaScript module (only default export is available)
#0 115.6  @ ./node_modules/rsuite/esm/Cascader/Cascader.js
#0 115.6  @ ./node_modules/rsuite/esm/Cascader/index.js
#0 115.6  @ ./node_modules/rsuite/esm/index.js
#0 115.6  @ ./src/components/App/Main.js
#0 115.6  @ ./src/index.js
#0 115.6 
#0 115.6 ERROR in ./node_modules/react-use-set/dist/index.mjs 34:16-27
#0 115.6 Can't import the named export 'useCallback' from non EcmaScript module (only default export is available)
#0 115.6  @ ./node_modules/rsuite/esm/Cascader/Cascader.js
#0 115.6  @ ./node_modules/rsuite/esm/Cascader/index.js
#0 115.6  @ ./node_modules/rsuite/esm/index.js
#0 115.6  @ ./src/components/App/Main.js
#0 115.6  @ ./src/index.js
#0 115.6 
#0 115.6 ERROR in ./node_modules/react-use-set/dist/index.mjs 37:15-26
#0 115.6 Can't import the named export 'useCallback' from non EcmaScript module (only default export is available)
#0 115.6  @ ./node_modules/rsuite/esm/Cascader/Cascader.js
#0 115.6  @ ./node_modules/rsuite/esm/Cascader/index.js
#0 115.6  @ ./node_modules/rsuite/esm/index.js
#0 115.6  @ ./src/components/App/Main.js
#0 115.6  @ ./src/index.js
#0 115.6 
#0 115.6 ERROR in ./node_modules/react-use-set/dist/index.mjs 40:9-16
#0 115.6 Can't import the named export 'useMemo' from non EcmaScript module (only default export is available)
#0 115.6  @ ./node_modules/rsuite/esm/Cascader/Cascader.js
#0 115.6  @ ./node_modules/rsuite/esm/Cascader/index.js
#0 115.6  @ ./node_modules/rsuite/esm/index.js
#0 115.6  @ ./src/components/App/Main.js
#0 115.6  @ ./src/index.js

Expected Behavior

Build just fine

To Reproduce

Use rsuite version 5.32.0 in a react project, builds just fine with 5.31.1

I am using react 16+ react scripts 4.0.3 rsuite 5.32.0

I am having the same issue mentioned above on npm start and npm build Downgraded to 5.31.1 .Still the same issue

The version 4.11.1 works absolutely fine, but I am looking for DataTimeRange picker

4.11.1 worked for me as we are using only Slider it's not throwing any build errors. Thank you.

@github-actions github-actions bot added the Stale label Sep 2, 2023
@github-actions github-actions bot closed this as not planned Won't fix, can't repro, duplicate, stale Sep 9, 2023
@simonguo simonguo mentioned this issue Mar 20, 2024
Open
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@SevenOutman SevenOutman

Labels
Stale status: Needs More Info There's no enough information to understand or reproduce the issue topic: Build
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
6 participants
@simonguo @SevenOutman @daniel-dona @VenkateshMogili @surongm @Marina-Mascarenhas