No changes, and my build is now breaking?

I happen to use Quill (a rich text editor). I made 0 changes since Friday, and now all of the sudden my build is failing in preview with the error:

Failed to load “quill” from “blob:redacted-url. Modules must be served with a valid MIME type like application/javascript.”, make sure it exists

Any attempt to fix it with v0 continues to fail. It feels like there’s an issue in NPM or something behind the scenes in the v0 preview environment broke. How do you all fix issues like this?

Any attempt to revert to an earlier “working” version fails with the same reason.

Also this kind of thing is infuriating because I’ve probably lost $6 trying to fix this multiple times

Are you familiar with the code you’re trying to fix or was the code generated through v0 agent itself?

If you wrote that part of the code or you understand the code where ‘quill’ is being used, I’d appreciate it if you could share the snippet of its usage. Or you could share your chat if it isn’t too personal…

quill is just the dependency in package.json:
“quill”: “2.0.3”

quill is imported this way (dynamically):

 useEffect(() => {
    if (typeof window !== "undefined" && editorRef.current && !quillRef.current) {
      import("quill").then((QuillModule) => {
        const Quill = QuillModule.default

Confirmed this is just an issue with preview. I redeployed to production and it works there.

Any advice @hasriza ?

This doesn’t seem to be an issue with my code, but the preview environment. Are there ways to “kick” the preview environment? Like get it to rebuild like building in production?

Now I’ve manually changed some code (syntactically correct, doesn’t break), and it publishes to production, but fails to load in the preview environment with this cryptic error:

Failed to load "https://preview-REDACTED/50881ce6-e48d-42a6-8555-8645b7ae5dd5" from "blob:https://preview-REDACTED/412a9254-aec9-4450-843d-8c26909e5898 - see network log for details.", make sure it exists.

??

We might have to confirm with the v0 team if quill is supported in v0 preview. @jacobparis @anshumanb

That being said, have you tried to check the Network window like the error suggests? There might be some hint in one of the error responses

Thanks for the hint @hasriza. It may be the case. Let me check with the team.

1 Like

Hi @rtruxler, I wasn’t able to recreate it just with Quill, as it works for me in preview alright:

Can you share the chat URL so I can debug further?

1 Like

Thanks for helping, Anshuman. Chat url:
https://v0.app/chat/teams-filtering-WdmgHrHGCLZ

Hi @rtruxler, I’ll share this with our team and keep you posted when I have updates.

Amazing, thanks again Anshuman!

1 Like

I’m still stuck here. @anshumanb it would ve helpful if you at least shared your v0 link for your working example.

Hi @rtruxler, sorry that it’s taking long. Here’s my chat: https://v0.app/chat/yearly-achievement-app-sAFETbL7xWS

I’m experiencing something similar with trying to use Leaflet (map alternative to google maps). This is the error message I see in the v0 preview:

Failed to load “leaflet” from “blob:https://preview-duplicate-of-fork-of-horse-website-kzmg29qkt36qbnews6k2.vusercontent.net/cd6f5e30-877c-4a5f-94a0-9f4c8c0fd8d5. Modules must be served with a valid MIME type like application/javascript.”, make sure it exists.

(note that the build works fine, and that the deploy is successful too!)

I looked around for suspicious looking files per your suggestion @hasriza . When I view the https://esm.v0.dev/leaflet@%5E1.9.4/dist resource in the network tab, I see the response is the text “could not resolve build entry”, where there would normally be javascript.

Any help getting this unstuck would be appreciated! Thank you!

Hi Kelty! I’ll look into your problem but I would suggest creating a new post with appropriate title so that someone in the future could refer your post and save time, if a solution is found.

@keltyj and @rtruxler, could you guys share your package json file here?

{
  "name": "my-v0-project",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "build": "next build",
    "dev": "next dev",
    "lint": "next lint",
    "start": "next start"
  },
  "dependencies": {
    "@hookform/resolvers": "^3.9.1",
    "@radix-ui/react-accordion": "1.2.2",
    "@radix-ui/react-alert-dialog": "1.1.4",
    "@radix-ui/react-aspect-ratio": "1.1.1",
    "@radix-ui/react-avatar": "1.1.2",
    "@radix-ui/react-checkbox": "1.1.3",
    "@radix-ui/react-collapsible": "1.1.2",
    "@radix-ui/react-context-menu": "2.2.4",
    "@radix-ui/react-dialog": "1.1.4",
    "@radix-ui/react-dropdown-menu": "latest",
    "@radix-ui/react-hover-card": "1.1.4",
    "@radix-ui/react-label": "2.1.1",
    "@radix-ui/react-menubar": "1.1.4",
    "@radix-ui/react-navigation-menu": "1.2.3",
    "@radix-ui/react-popover": "1.1.4",
    "@radix-ui/react-progress": "1.1.1",
    "@radix-ui/react-radio-group": "1.2.2",
    "@radix-ui/react-scroll-area": "1.2.2",
    "@radix-ui/react-select": "2.1.4",
    "@radix-ui/react-separator": "1.1.1",
    "@radix-ui/react-slider": "1.2.2",
    "@radix-ui/react-slot": "latest",
    "@radix-ui/react-switch": "1.1.2",
    "@radix-ui/react-tabs": "latest",
    "@radix-ui/react-toast": "1.2.4",
    "@radix-ui/react-toggle": "1.1.1",
    "@radix-ui/react-toggle-group": "1.1.1",
    "@radix-ui/react-tooltip": "1.1.6",
    "@vercel/analytics": "1.3.1",
    "autoprefixer": "^10.4.20",
    "class-variance-authority": "^0.7.1",
    "clsx": "^2.1.1",
    "cmdk": "1.0.4",
    "date-fns": "4.1.0",
    "embla-carousel-react": "8.5.1",
    "geist": "^1.3.1",
    "input-otp": "1.4.1",
    "leaflet": "^1.9.4",
    "lucide-react": "^0.454.0",
    "next": "15.2.4",
    "next-themes": "latest",
    "react": "^19",
    "react-day-picker": "9.8.0",
    "react-dom": "^19",
    "react-hook-form": "^7.54.1",
    "react-leaflet": "^5.0.0",
    "react-resizable-panels": "^2.1.7",
    "recharts": "2.15.0",
    "sonner": "^1.7.1",
    "tailwind-merge": "^2.5.5",
    "tailwindcss-animate": "^1.0.7",
    "vaul": "^0.9.6",
    "zod": "^3.24.1"
  },
  "devDependencies": {
    "@types/leaflet": "^1.9.20",
    "@types/node": "^22",
    "@types/react": "^19",
    "@types/react-dom": "^19",
    "postcss": "^8.5",
    "tailwindcss": "^3.4.17",
    "typescript": "^5"
  }
}

Yes for sure! See above.

1 Like

Thanks for that! So leaflet is clearly included in the project for preview as well. I tried recreating it and it seems to be working for me in preview.

Chat link: https://v0.app/chat/interactive-map-page-vs6AiNezegK

Would it be possible to try viewing it in incognito or a different browser?