I am on a TypeScript NextJS project trying to use a loading component from this package, so I installed the package with Yarn and tried to use it but I got this output:
error - ./node_modules/react-cssfx-loading/lib/Spin/Spin.module.css
CSS Modules cannot be imported from within node_modules.
Read more: https://nextjs.org/docs/messages/css-modules-npm
Location: node_modules/react-cssfx-loading/lib/Spin/index.js
BTW this is the same with other components.
Here is my dependencies list, maybe something else is causing the issue:
"dependencies": {
"@types/jest": "^27.0.2",
"@types/node": "^16.10.3",
"@types/react": "^17.0.27",
"@types/react-dom": "^17.0.9",
"axios": "^0.23.0",
"bcryptjs": "^2.4.3",
"bootstrap": "^5.1.0",
"cors": "^2.8.5",
"dotenv": "^10.0.0",
"jsonwebtoken": "^8.5.1",
"mongoose": "^6.0.10",
"next": "^12.0.1",
"react": "^17.0.2",
"react-cssfx-loading": "^1.0.2",
"react-dom": "^17.0.2",
"react-is": "^17.0.2",
"sass": "^1.42.1",
"styled-components": "^5.3.1",
"typescript": "^4.4.3"
},
"devDependencies": {
"@types/bcryptjs": "^2.4.2",
"@types/jsonwebtoken": "^8.5.5",
"@types/styled-components": "^5.1.14",
"babel-plugin-styled-components": "^1.13.2",
"eslint": "7.32.0",
"eslint-config-next": "11.1.2"
}