🐛[BUG] 编译报错

[xyunsh]

🐛 bug 描述

ERROR in ./node_modules/core-util-is/lib/util.js 86:0-52
Module not found: Error: Can't resolve 'buffer' in '/projects/node_modules/core-util-is/lib'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
        - add a fallback 'resolve.fallback: { "buffer": require.resolve("buffer/") }'
        - install 'buffer'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "buffer": false }

ERROR in ./node_modules/duplexer2/node_modules/safe-buffer/index.js 2:13-30
Module not found: Error: Can't resolve 'buffer' in '/projects/node_modules/duplexer2/node_modules/safe-buffer'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
        - add a fallback 'resolve.fallback: { "buffer": require.resolve("buffer/") }'
        - install 'buffer'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "buffer": false }

ERROR in ./node_modules/multipipe/index.js 6:18-47
Module not found: Error: Can't resolve 'stream' in '/projects/node_modules/multipipe'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
        - add a fallback 'resolve.fallback: { "stream": require.resolve("stream-browserify") }'
        - install 'stream-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "stream": false }

ERROR in ./node_modules/readable-stream/lib/_stream_readable.js 29:13-37
Module not found: Error: Can't resolve 'buffer' in '/projects/node_modules/readable-stream/lib'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
        - add a fallback 'resolve.fallback: { "buffer": require.resolve("buffer/") }'
        - install 'buffer'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "buffer": false }

ERROR in ./node_modules/readable-stream/lib/_stream_readable.js 41:13-30
Module not found: Error: Can't resolve 'stream' in '/projects/node_modules/readable-stream/lib'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
        - add a fallback 'resolve.fallback: { "stream": require.resolve("stream-browserify") }'
        - install 'stream-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "stream": false }

ERROR in ./node_modules/readable-stream/lib/_stream_writable.js 29:13-37
Module not found: Error: Can't resolve 'buffer' in '/projects/node_modules/readable-stream/lib'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
        - add a fallback 'resolve.fallback: { "buffer": require.resolve("buffer/") }'
        - install 'buffer'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "buffer": false }

ERROR in ./node_modules/readable-stream/lib/_stream_writable.js 39:13-30
Module not found: Error: Can't resolve 'stream' in '/projects/node_modules/readable-stream/lib'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
        - add a fallback 'resolve.fallback: { "stream": require.resolve("stream-browserify") }'
        - install 'stream-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "stream": false }

ERROR in ./node_modules/readable-stream/readable.js 1:13-30
Module not found: Error: Can't resolve 'stream' in '/projects/node_modules/readable-stream'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
        - add a fallback 'resolve.fallback: { "stream": require.resolve("stream-browserify") }'
        - install 'stream-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "stream": false }

ERROR in ./node_modules/readable-stream/readable.js 10:2-36
Module not found: Error: Can't resolve 'stream' in '/projects/node_modules/readable-stream'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
        - add a fallback 'resolve.fallback: { "stream": require.resolve("stream-browserify") }'
        - install 'stream-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "stream": false }

ERROR in ./node_modules/string_decoder/index.js 22:13-37
Module not found: Error: Can't resolve 'buffer' in '/projects/node_modules/string_decoder'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
        - add a fallback 'resolve.fallback: { "buffer": require.resolve("buffer/") }'
        - install 'buffer'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "buffer": false }

ERROR in ./node_modules/through/index.js 1:13-30
Module not found: Error: Can't resolve 'stream' in '/projects/node_modules/through'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
        - add a fallback 'resolve.fallback: { "stream": require.resolve("stream-browserify") }'
        - install 'stream-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "stream": false }

© 版本信息

• antd-style 版本: [e.g. 3.4.4]
• 浏览器环境
• 开发环境 [e.g. mac OS]

🚑 其他信息

添加antd-style就会报错，移除就恢复正常

[arvinxx]

跟你构建环境有关吧？用了 webpack5 吗？

[arvinxx]

参考下 https://github.com/ant-design/antd-style/issues/36

[xyunsh]

参考下 #36

我用的 craco，请问这个有解决方案么？🙏

[xyunsh]

craco 7.1.0

[arvinxx]

应该是一样的，你仔细看下。核心逻辑就是排除node侧依赖

[xyunsh]

1. yarn add buffer stream-browserify -D
2. 修改craco.config.js

   module.exports = {
   webpack: {
       configure: (webpackConfig, { env, paths }) => {
           return {
               ...webpackConfig,
               resolve: {
                   ...webpackConfig.resolve,
                   fallback: {
                       ...webpackConfig.resolve.fallback,
                       buffer: require.resolve('buffer'),
                       stream: require.resolve('stream-browserify'),
                   },
               },
           };
       },
   },
   };