package downloaded without dist/css

[TheAlmightyCrumb]

Error Description

Imported the css file to app.js as mentioned in the README.md file

/* App.js */
import "react-loader-spinner/dist/loader/css/react-spinner-loader.css";

Got that error:

ERROR in ./src/App.js 11:0-72
Module not found: Error: Can't resolve 'react-loader-spinner/dist/loader/css/react-spinner-loader.css' in '~/<PROJECT>/src'

Cause & Fix

I went ahead and looked into node_modules/react-loader-spinner/dist/loader and there was no folder named "css" with the specified files in it. To fix it I copied react-loader-spinner/src/loader/css but not all the CSS is in there for all the loaders to work.

[DevYemi]

I'm Having the same issue right now and this isn't my first time using the package but this is my first time using the package with NEXTJS. Thank you i just fixed the issue too with your help

[sheggietyn]

Same problems here any solurtions

[DevYemi]

@TheAlmightyCrumb has provided a solution already, follow his instructions, you will need to create your own dist/css in module, follow the link he provided you will see the files to copy

[andres-dejesus]

That looks more like a hack than a solution, might as well just copy the entire project than use npm.

[narasaka]

I just did

import { Oval } from "react-loader-spinner";

without importing the css,

Haven't tried it with other spinners other than Oval, but that worked.

[DevYemi]

Thats because all the animations are animated with svg SMIL so they dont require a css file, they were animated directly in thier React Components except CradleLoader, Plane and Triangle. You need to import the css file to be able to use this three

[TheAlmightyCrumb]

That looks more like a hack than a solution, might as well just copy the entire project than use npm.

@pascuflow That isn't a hack, just a missing file. Also, you do have tools that are downloaded without npm, but anyway, the entire project should exist in the npm library (not talking about development stuff) which is now broken because there is a missing file that other files import directly.

[gepthecoder]

@narasaka yes, thank you - worked for me. Removing the import from app.js and just importing the spinner you like where you want to put it and thats it 🍕

[amanzrx4]

Don't import any css everything works, i think the docs needs to be updated

[mhnpd]

CSS files were replaced with css-in-jsx library and CSS imports are no longer required.