V12.0.1 URL Import - `Cannot find module or type declarations` when deploying to Vercel

What version of Next.js are you using?

12.0.1

What version of Node.js are you using?

v14.17.6

What browser are you using?

Safari/Chrome

What operating system are you using?

Linux

How are you deploying your application?

Vercel

Describe the Bug

Importing Confetti and rendering in a simple application, works perfectly on dev server when running next dev error shows in IDE and when deploying to Vercel.

Full error message:

Type error: Cannot find module 'https://cdn.skypack.dev/canvas-confetti' or its corresponding type declarations.

Expected Behavior

Deploy to work without issue.

To Reproduce

Create next.js project on Version 12 using the following code

import confetti from "https://cdn.skypack.dev/canvas-confetti"
import {useEffect} from "react"

export default function Home() {
  useEffect(() => {
    confetti()
  })
  return <h1>Home</h1>
}

[aboveyunhai]

Well, in some edge special cases where your import url is actually a typescript file itself then it’s not going to work. I guess //@ts-ignore is the only way to go right now for this particular case until it’s fixed later.

[github-actions[bot]]

This closed issue has been automatically locked because it had no new activity for a month. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.