next js - ethers

[NagoriMustakim]

I am getting this error IDK why Module not found: Can't resolve 'ethers'
error:

Module not found: Can't resolve 'ethers'
  2 | import Image from 'next/image'
  3 | import { useState } from 'react'
> 4 | import {ethers} from 'ethers'
  5 | import styles from '../styles/Home.module.css'
  6 | 
  7 | export default function Home() {

my index.js is

import Head from 'next/head'
import Image from 'next/image'
import { useState } from 'react'
import {ethers} from 'ethers'
import styles from '../styles/Home.module.css'

export default function Home() {
  const [isConnected, setIsConnected] = useState(false)
  const [provider, setProvider] = useState()
  async function connect() {
    if (typeof window.ethereum !== "undefined") {
      try {
        await ethereum.request({ method: "eth_requestAccounts" })
        setIsConnect(true)
        let connectedProvider = new ethers.providers.web3Provider
      } catch (e) {
        console.log(e)
      }
    }
  }
  return <div>Welcome to Next.js!</div>
}

[krakxn]

@NagoriMustakim Remove this line and then run the code: import {ethers} from 'ethers'

Let me know if this fixes your problem