Repository: next.js
Issue: Dynamic Imports gives Application error: a client-side exception has occurred (see the browser console for more information). on Vercel
Labels: bug

### Verify canary release

- [X] I verified that the issue exists in the latest Next.js canary release

### Provide environment information

```bash
Operating System:
      Platform: win32
      Arch: x64
      Version: Windows 10 Home
    Binaries:
      Node: 16.19.1
      npm: N/A
      Yarn: N/A
      pnpm: N/A
    Relevant packages:
      next: 13.3.0
      eslint-config-next: 12.3.4
      react: 18.2.0
      react-dom: 18.2.0
```


### Which area(s) of Next.js are affected? (leave empty if unsure)

_No response_

### Link to the code that reproduces this issue

https://cootie.finance/swap

### To Reproduce

try dynamic imports and deploy it to vercel

### Describe the Bug

hello my code works locally  but im having this issue Application error: a client-side exception has occurred (see the browser console for more information)  when i deploy to vercel. im trying to use dynamic imports. i did try v13.2.4 and latest nextjs and does not work on vercel

/* eslint @typescript-eslint/no-var-requires: "off" /
/ eslint-disable complexity /
/ eslint @typescript-eslint/no-explicit-any: "off" /
/ eslint-disable arrow-spacing /
/ eslint-disable no-await-in-loop /
/ eslint-disable arrow-parens /
/ eslint-disable arrow-spacing /
/ eslint-disable prefer-const /
/ eslint-disable no-undef /
/ eslint-disable prefer-arrow-callback /
/ eslint-disable array-callback-return */

/* eslint @typescript-eslint/no-unused-vars: "off" */

/* eslint-disable etc/no-commented-out-code /
/ eslint-disable no-loop-func /
/ eslint-disable no-inline-comments /
/ eslint-disable no-inline-comments /
/ eslint @typescript-eslint/no-shadow: "off" /
/ eslint @typescript-eslint/no-empty-function: "off" */

import type {
SwapWidget as SwapWidgetType,
PangolinProvider as PangolinProviderType,
} from '@pangolindex/components';

import dynamic from 'next/dynamic';
import { makeStyles } from '@material-ui/core/styles';

import { useAccount } from 'wagmi'
import { Typography } from '@web3uikit/core';
import { useEffect } from 'react';
import React from 'react';

const PangolinProvider = dynamic(
() => import('@pangolindex/components').then((module) => module.PangolinProvider) as any,
{ ssr: false },
) as typeof PangolinProviderType;

const SwapWidget = dynamic(() => import('@pangolindex/components').then((module) => module.SwapWidget) as any, {
ssr: false,
}) as typeof SwapWidgetType;

export default function Swap() {
const [ethAddress,setEthAddress]= React.useState("0")

const useStyles = makeStyles((theme :any)=> ({
root: {
width: '100%',
height: '100%',
position: 'relative',
'& video': {
objectFit: 'cover',
},
},
overlay: {
position: 'absolute',
top: 0,
left: 0,
width: '100%',
height: '100%',
backgroundColor: 'rgba(0, 0, 0, 0.5)',
},
title: {
paddingBottom: theme.spacing(4),
},
}));

useEffect(()=>{
if(address){
setEthAddress(address)
}
},[])

const { address } = useAccount()

const classes = useStyles();
return (
<div
style={{
backgroundImage: url(${"https://cdn.discordapp.com/attachments/907590324627595284/1076218522100826182/blockchain_2.png"}),
backgroundSize: 'cover',
backgroundRepeat: 'no-repeat',
backgroundPosition: 'center',
width: '100vw',
minHeight: '100vh',
margin:-8,
alignItems:"center"

  }}
> <div
style={{
  paddingTop:100,
  display: 'flex',
  flexDirection: 'column',
  alignItems:"center",
  width:"100%",
}}
<Typography fontFamily={"poppins"} color="white" variant="h1" component="h1" className={classes.title}>
Token Swap

<div
style={{
paddingTop:20,
paddingBottom:100,
display: 'flex',
width:"40%",
alignSelf:"center",
flexDirection: 'row',
justifyContent:"center",
alignItems:"center",
}}

<PangolinProvider account={ethAddress} chainId={19} library={""}>
  <SwapWidget isLimitOrderVisible={false} />
</PangolinProvider> 
)
}

### Expected Behavior

works locally but
![test](https://user-images.githubusercontent.com/36853339/230741449-79527ace-2d36-4503-bb9b-21e29f5a085a.png)

 fails if is deployed to vercel 
![github](https://user-images.githubusercontent.com/36853339/230741335-58f7f5ab-da41-46e0-b70c-1a27429dc358.png)


### Which browser are you using? (if relevant)

_No response_

### How are you deploying your application? (if relevant)

_No response_