如何在 angular.json 中包含的 javascript 文件中使用 jquery

Question

i am using a javascript file that use jquery in it .. to use this js file i put it in script array in angular.json file and put also the jquery in the same array before this file. but when i run the angular project it get me

missing declare for $

"scripts": [
   "node_modules/jquery/dist/jquery.min.js"
   "node_modules/popper.js/dist/umd/popper.min.js",
   "node_modules/bootstrap/dist/js/bootstrap.min.js",
   "node_modules/crypto-js/crypto-js.js",
   "assets/js/theme.js"
]

the file theme.js is the one that use jquery in it.

Answer 1

To Install JQuery follow below steps

1. install jQuery using npm as

   npm install jquery — save

2. Navigate to the ./angular-cli.json file at the root of your Angular CLI project folder, and find the scripts: [] property, and include the path to jQuery

   "scripts": [ "../node_modules/jquery/dist/jquery.min.js" ]

3. Now you have to do is to import it in whatever component you want to use jQuery

   import * as $ from 'jquery'; (or) declare var $: any;

Answer 2

Assuming you have installed JQuery using npm install jquery You need to additionally install types as well.

Install types for jquery using

npm install --save-dev @types/jquery

and for using jquery in your component you need to use :

import * as $ from 'jquery';