The high-level answer is that parcel automatically minifies and optimizes css files, so you don't need to do anything special to make sure that your production build is as small as possible.
If you want to understand in detail how parcel handles this particular package, read on.
Parcel generally follows node resolution conventions to figure out which files to actually import when you reference a package name.
In this case, the import "animate.css"
will tell parcel to go looking in the nearest node_modules
folder for a for a subfolder called animate.css
. It finds it, and then looks for the package.json
file at the root. In this case, the package.json
has a main
field that points to a file called animate.css
(e.g. the un-minified version).
Parcel will use that file as the basis for development and production builds. When you run parcel in development, it leaves this file untouched. When you run parcel build
it will process this (unminified) file through cssnano
so the build output is minified.
So the interesting fact is that even though there is another file called node_modules/animate/animate.min.css
living there, Parcel is able to achieve the desired behavior without touching it. The publishers of animate.css
included it for other folks that aren't using a bundler that's as awesome as parcel - you can safely ignore it.