How can I use jQuery in an Angular 8 app?
More elegant way without using
declare var $: any;
First run
npm install jquery --save
npm install @types/jquery --save
Then in scripts section in architect => build of angular.json file add path for jquery lib
"scripts": [
"node_modules/jquery/dist/jquery.min.js"
]
Then in your tsconfig.app.json
{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../out-tsc/app",
"types": ["jquery"] // add here
},
"exclude": ["test.ts", "**/*.spec.ts"]
}
So now you can use jquery anywhere in your project without using declare var $ : any
for every file you need to use jquery
Angular 8 works with JQuery.
"dependencies": {
...
"jquery": "^3.4.1",
...
}
in your angular.json file import the required file like this:
"scripts": [
"node_modules/jquery/dist/jquery.min.js"
]
no ./
at the beginning, just node_modules/...
In your app.module verify it is working like this:
import { AppComponent } from './app.component';
declare var $: any;
console.log(`jQuery version: ${$.fn.jquery}`);
@NgModule({
In the developer tools console it should print this:
jQuery version: 3.4.1