Errors when using storybook with React and Chakra UI - reactjs

Question

I'm using React (17.0.2), Chakra UI and Storybook (6.5.15) to create a component library. I don't use create-react-app because I don't really need to run it as an app. However, I can't get around the errors related to the core node modules that I receive like can't resolve module 'fs'. I have tried to add custom configuration to main.js for Storybook's webpack v5 so that it will ignore the node core modules like this:
webpackFinal: (config) => {
config.resolve.fallback.fs = false;
config.resolve.fallback.module = false;
config.resolve.fallback.os = false;
return config;
},
When I try to show the story for the component I receive the following error:
TypeError: fs[fsStatType] is not a function
at isTypeSync (http://localhost:6006/vendors-node_modules_chakra-ui_layout_dist_chakra-ui-layout_esm_js-node_modules_chakra-ui_spi-d8af64.iframe.bundle.js:116363:24)
at getDirectorySync (http://localhost:6006/vendors-node_modules_chakra-ui_layout_dist_chakra-ui-layout_esm_js-node_modules_chakra-ui_spi-d8af64.iframe.bundle.js:82082:61)
at ExplorerSync.searchSync (http://localhost:6006/vendors-node_modules_chakra-ui_layout_dist_chakra-ui-layout_esm_js-node_modules_chakra-ui_spi-d8af64.iframe.bundle.js:81910:63)
Below you'll find a list of the dev dependencies from my package.json.
"devDependencies": {
"#babel/cli": "^7.20.7",
"#babel/core": "^7.20.12",
"#babel/preset-env": "^7.20.2",
"#babel/preset-react": "^7.18.6",
"#chakra-ui/react": "^1.7.1",
"#chakra-ui/storybook-addon": "^4.0.16",
"#emotion/react": "^11.1.5",
"#emotion/styled": "^11.1.5",
"#rollup/plugin-babel": "^6.0.3",
"#rollup/plugin-commonjs": "^24.0.0",
"#rollup/plugin-node-resolve": "^15.0.1",
"#rollup/plugin-typescript": "^10.0.1",
"#storybook/addon-actions": "^6.5.15",
"#storybook/addon-essentials": "^6.5.15",
"#storybook/addon-interactions": "^6.5.15",
"#storybook/addon-links": "^6.5.15",
"#storybook/builder-webpack5": "^6.5.15",
"#storybook/manager-webpack5": "^6.5.15",
"#storybook/react": "^6.5.15",
"#storybook/testing-library": "0.0.13",
"#types/react": "^18.0.26",
"babel-loader": "^8.3.0",
"base64-arraybuffer": "^1.0.2",
"cross-fetch": "^3.1.5",
"crypto": "^1.0.1",
"framer-motion": "^6.5.0",
"jest-fetch-mock": "^3.0.3",
"js-cookie": "^3.0.1",
"jwt-decode": "^3.1.2",
"nanoid": "^4.0.0",
"njwt": "^1.2.0",
"node-polyfill-webpack-plugin": "^2.0.1",
"npm-run-all": "^4.1.5",
"randomstring": "^1.2.3",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"rollup": "^3.9.1",
"rollup-plugin-delete": "^2.0.0",
"rollup-plugin-dts": "^5.1.0",
"rollup-plugin-peer-deps-external": "^2.2.4",
"tslib": "^2.4.1",
"typescript": "^4.9.4",
"webpack": "^5.75.0"},
Does anyone have an idea on how to solve this issue?
I have tried to add the NodePolyfillPlugin plugin to webpack but I was still receiving errors related to fs, likely because it doesn't have a fallback for it and adding aliases with the modules to resolve it to node modules but I wasn't able to find an npm package for 'fs'. It seems deprecated?