I'm trying to run my custom react component library through storybook with nx.
Expected Result
Whenever I run nx run my-lib:storybook
command the storybook will open successfuly.
Actual results
After running the command I see the following error:
webpack built preview 90be684218940772f424 in 162ms Error: NormalModuleFactory.beforeResolve (IgnorePlugin) is no longer a waterfall hook, but a bailing hook instead. Do not return the passed object, but modify it instead. Returning false will ignore the request and results in no module created. at .....
Dependencies of my app
"dependencies": {
"@emotion/react": "11.9.3",
"@emotion/styled": "11.9.3",
"@rollup/plugin-commonjs": "21.1.0",
"@testing-library/jest-dom": "5.15.1",
"axios": "0.24.0",
"core-js": "3.6.5",
"http-proxy-middleware": "2.0.1",
"jszip": "3.7.1",
"msw": "0.36.3",
"react": "17.0.2",
"react-dom": "17.0.2",
"react-slick": "0.28.1",
"react-router-dom": "6.0.2",
"react-canvas-draw": "1.2.1",
"react-lottie-player": "1.4.1",
"react-zoom-pan-pinch": "2.1.3",
"regenerator-runtime": "0.13.7",
"tiny-cookie": "2.3.2",
"tslib": "2.3.0"
},
"devDependencies": {
"@babel/core": "7.16.0",
"@babel/plugin-proposal-private-property-in-object": "7.16.7",
"@babel/preset-env": "7.16.4",
"@babel/preset-react": "7.18.6",
"@babel/preset-typescript": "7.18.6",
"@craco/craco": "6.4.5",
"@emotion/babel-plugin": "11.9.2",
"@nrwl/cli": "14.4.3",
"@nrwl/cypress": "14.4.3",
"@nrwl/eslint-plugin-nx": "14.4.3",
"@nrwl/linter": "14.4.3",
"@nrwl/nx-cloud": "latest",
"@nrwl/react": "14.4.3",
"@nrwl/storybook": "14.4.3",
"@nrwl/web": "14.4.3",
"@nrwl/workspace": "14.4.3",
"@storybook/addon-essentials": "6.5.9",
"@storybook/builder-webpack5": "6.5.9",
"@storybook/core-server": "6.5.9",
"@storybook/manager-webpack5": "6.5.9",
"@storybook/react": "6.5.9",
"@svgr/webpack": "5.4.0",
"@testing-library/react": "11.2.7",
"@testing-library/react-hooks": "7.0.2",
"@testing-library/user-event": "12.8.3",
"@types/jest": "27.4.1",
"@types/node": "17.0.22",
"@types/qs": "6.9.7",
"@types/react": "17.0.37",
"@types/react-canvas-draw": "1.1.1",
"@types/react-dom": "17.0.14",
"@types/react-slick": "0.23.8",
"@typescript-eslint/eslint-plugin": "5.29.0",
"@typescript-eslint/parser": "5.29.0",
"babel-jest": "27.5.1",
"babel-loader": "8.1.0",
"cypress": "9.1.0",
"eslint": "8.15.0",
"eslint-config-airbnb": "19.0.4",
"eslint-config-airbnb-typescript": "16.1.0",
"eslint-config-prettier": "8.3.0",
"eslint-config-react-app": "7.0.1",
"eslint-plugin-cypress": "2.10.3",
"eslint-plugin-import": "2.26.0",
"eslint-plugin-jsx-a11y": "6.5.1",
"eslint-plugin-react": "7.30.1",
"husky": "7.0.4",
"jest": "27.5.1",
"jest-mock": "27.5.1",
"jest-watch-typeahead": "2.0.0",
"lint-staged": "12.1.2",
"nx": "14.4.3",
"prettier": "2.6.2",
"react-scripts": "4.0.3",
"react-test-renderer": "17.0.2",
"sass": "1.44.0",
"ts-jest": "27.1.4",
"ts-node": "10.4.0",
"typescript": "4.5.2",
"url-loader": "3.0.0",
"web-vitals": "2.1.4"
},
I think it's something related to webpack versions but it's only a guess. Thank you for your help.