Vite JS - [vite]: Rollup failed to resolve import "jquery,"

[SPannan]

Using Vite for Laravel 10 development and Vite configuration is defeating me from running older JQuery .
I have installed npm jquery and jquery-validation.
When I run my build I keep getting

[vite]: Rollup failed to resolve import "jquery,"

yet I have imported jquery in my app.js file and also in my package.json.
Any help would be appreciated. Find contents of app.js and package.json.

A solution would be amazing but an explanation of the build process would be amazing.

In my app.js:
import $ from 'jquery';
import jqueryValidate from "jquery-validation";

In my package .json:

"dependencies": {
"jquery-validation": "^1.20.0",
"aos": "^3.0.0-beta.6",
"bootstrap": "^5.3.2",
"jquery": "^3.7.1"
}