Uncaught TypeError: Failed to resolve module specifier "react-router-dom". Relative references must start with either "/", "./", or "../"

I get the following error after building and running command npm run preview:

Uncaught TypeError: Failed to resolve module specifier "react-router-dom". Relative references must start with either "/", "./", or "../".

This is my App.jsx file:

import { createBrowserRouter, createRoutesFromElements, Route, RouterProvider } from 'react-router-dom'
import { Contact } from './components/Contact'
import { Feature } from './components/Feature'
import { Navigation } from './components/Navigation'
import { Pricing } from './components/Pricing'
import { BlogHost } from "./components/BlogHost"

const router = createBrowserRouter(
  createRoutesFromElements(
    <Route path='/' element={<Navigation />}>
      <Route path='/BlogHost' element={<BlogHost />} />
      <Route path='/Feature' element={<Feature />} />
      <Route path='/Pricing' element={<Pricing />} />
      <Route path='/Contact' element={<Contact />} />
    </Route>
  )
)


const App = () => {
  return (
    <div className='box-border '>
    <RouterProvider router={router} />
    </div>
  )
}

export default App 

Pls, I need help to resolve this issue. Here is the vite.config.js file:

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [react()],
  build: {
    rollupOptions: {
      external: ['@headlessui/react', 'react-router-dom', '@heroicons/react/24/outline'],
    }
  }
})

Here is my little solution.

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [react()],
  build: {
    rollupOptions: {
      external: [],
    }
  }
})

I emptied the array and reinstalled the dependencies.