After I imported the code from github and run npm run dev
to show website, the error below occur. So, I must reinstalled three libraries react-beautiful-dnd, react-modal, react-datepicker to make the website work.
Error: The following dependencies are imported but could not be resolved:
react-beautiful-dnd (imported by /Users/future/trello-clone/trello-clone/src/App.tsx)
react-datepicker (imported by /Users/future/trello-clone/trello-clone/src/App.tsx)
react-datepicker/dist/react-datepicker.css (imported by /Users/future/trello-clone/trello-clone/src/App.tsx)
react-modal (imported by /Users/future/trello-clone/trello-clone/src/App.tsx)
Are they installed?
at file:///Users/future/trello-clone/trello-clone/node_modules/vite/dist/node/chunks/dep-3b8eb186.js:45655:23
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async file:///Users/future/trello-clone/trello-clone/node_modules/vite/dist/node/chunks/dep-3b8eb186.js:45064:38
Failed to resolve import "react-beautiful-dnd" from "src/App.tsx". Does the file exist?
3:26:24 PM [vite] Internal server error: Failed to resolve import "react-beautiful-dnd" from "src/App.tsx". Does the file exist?
How can I fix this issue so to be able to run npm run dev
without reinstalling these three libraries? Here is my dependencies and devdependencies from my package.json file.
{
"name": "trello-clone",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "tsc && vite build",
"lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
"preview": "vite preview"
},
"dependencies": {
"react": "^18.2.0",
"react-beautiful-dnd": "^13.1.1",
"react-datepicker": "^4.16.0",
"react-dom": "^18.2.0",
"react-modal": "^3.16.1",
"@types/react-beautiful-dnd": "^13.1.4",
"@types/react-datepicker": "^4.15.0",
"@types/react-modal": "^3.16.0"
},
"devDependencies": {
"@types/react": "^18.2.15",
"@types/react-dom": "^18.2.7",
"@typescript-eslint/eslint-plugin": "^6.0.0",
"@typescript-eslint/parser": "^6.0.0",
"@vitejs/plugin-react": "^4.0.3",
"eslint": "^8.45.0",
"eslint-plugin-react-hooks": "^4.6.0",
"eslint-plugin-react-refresh": "^0.4.3",
"typescript": "^5.0.2",
"vite": "^4.4.5"
}
}