Internal server error: Failed to resolve import "@formkit/auto-animate/vue" from "resources\js\app.js". Does the file exist?
opened this issue ยท comments
Good day, guys :)
I spent ~ about 2hours trying to make it work so I decided to post it here.
I exactly did the following:
- npm install @formkit/auto-animate
- import { autoAnimatePlugin } from '@formkit/auto-animate/vue'
- app.use(autoAnimatePlugin);
but I kept getting this error!
I use:
- Laravel 10.3
- Laragon with SSL enabled
- Vue 3.2
- Vite 4
please note that the environment/setup/application is already there fully running and functioning well but if I add this import the system crashes, meaning if I commented on this line: import { autoAnimatePlugin } from '@formkit/auto-animate/vue' things will go back to normal.
I just desired to add this amazing animation to add life to my application.
kindly advice ๐๐น
Some questions:
- What version of node are you on?
- Are you sure it is actually installed in your codebase? Can you physically see the files in
node_modules/@formkit/auto-animate
? - Have you changed anything about your module resolution strategy โ what package manager are you using?
- node ver is 14.18.1
- yes sure, when I installed it the first time with npm I get the same issue, so I went to check the files and it felt like the files are not completed so I when to GitHub and manually download them, but I still had the same issue.
- no, I haven't changed anything, everything are in their defaults for a year and a half, I'm using npm (for js) & composer (for PHP)
Here is the physical folder
the only strange thing that I noticed is this is inside my package.json
while trying to find a solution, I also noticed inside (@formkit\auto-animate\package.json) the following lines:
these 3 files didn't exist physically anywhere inside (auto-animate) folder, I only can see (index.ts) inside node_modules@formkit\auto-animate\src\vue
please note that I use both npm and zip files from GitHub to download and install (auto-animate)
Why is there a src directory in your node_modules? This is the published package files: https://www.npmjs.com/package/@formkit/auto-animate?activeTab=code
I noticed the npm is not downloading the package correctly, after tons of googling I did this command:
npm config set package-lock true
magically the package was downloaded correctly and things seem to be working fine now ๐
Thank you @justin-schroeder for the link above, it was the trigger ๐๐น