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