Hello Metronic Support Team,
I'm currently working on a Metronic project that uses Tailwind CSS and the ReUI system. According to your latest changelog on https://reui.io/docs/changelog, it states:
Migrated from tailwindcss-animate to tw-animate-css.
I followed the migration steps as expected:
1-Uninstalled the old package:
npm uninstall tailwindcss-animate
2-Installed the new package:
npm install tw-animate-css
3-Imported the CSS in my styles.css file:
@import 'tw-animate-css/dist/tw-animate.css';
However, when running the project with Vite, I get the following error:
[vite] Internal server error:
Package path ./dist/tw-animate.css is not exported from package
node_modules/tw-animate-css (see exports field in package.json)
I understand that this is related to how Vite and modern bundlers handle the "exports" field in package.json. Since tw-animate-css does not expose the CSS file via the exports field, Vite blocks direct imports from node_modules.
I’d like to know:
What is the official recommendation for using tw-animate-css with Vite?
Could you please provide guidance on how this migration should be done properly with Vite-based projects?
Thank you for your support.
Hi,
Please try to import it as shown below:
@import "tailwindcss";
@import "tw-animate-css";