ASTRO - VITE - Rollup failed to resolve import

Problem

Was working on my site and implemented a simple searchbar (to try out =>) with React.js and Fuse.js on the blog page of my Astro build. So time to deploy it, so I thought. My builds at my cloud hosting kept failing and displaying “FAILED”. Digging into the log I find below error and I was literally like “What? No! Why?“.

7:09:32 PM: [vite]: Rollup failed to resolve import "~/layouts/MainLayout.astro" from "/opt/build/repo/src/pages/index.astro".
7:09:32 PM: This is most likely unintended because it can break your application at runtime.
7:09:32 PM: If you do want to externalize this module explicitly add it to
7:09:32 PM: `build.rollupOptions.external`

Solution

As you can observe there are only a few things that are important for troubleshooting:

[vite]: Rollup failed to resolve import
build.rollupOptions.external

[vite]: Rollup failed to resolve import

All that the first one is mentioning is that it does not see the file, meaning it does not recognise the path.

SOLUTION: Even though the path with the ”~/” (tilde) works fine (Internal) I opted to change it to “../” (dotdot) and deployed it again.

And (drum ruffle, tik tok tik tok) there we go, build was external completed…and I can move on!

build.rollupOptions.external

Yo! Wazzaaa with the 2nd | the latter. Hmm, out of curiousity I did check and noticed this as an option:

ASTRO | vite.build.rollupOptions and VITE | build.rollupOptions

and than I thought: for all the paths? Errr…nope, I am not going there. Might have been simpler than I read or not but it really is not a big issue for me to use dotdots instead of a tilde.

ASTRO - VITE - Rollup failed to resolve import

Description:

← Go Back