JQuery is not defined for angular 2

I am trying to use ng2-datetime. However, when I follow the instructions and install npm install --save ng2-datetime, I get the following error.

jQuery not defined

I tried to run the following installation of npm, but did not fix anything.

npm install jquery --save npm install @types/jquery --save-dev 

My package.json file

  { "name": "timesheet-web-app", "version": "0.0.0", "license": "MIT", "angular-cli": {}, "scripts": { "ng": "ng", "start": "ng serve", "lint": "tslint \"src/**/*.ts\"", "test": "ng test", "pree2e": "webdriver-manager update --standalone false --gecko false", "e2e": "protractor" }, "private": true, "dependencies": { "@angular/common": "^2.3.1", "@angular/compiler": "^2.3.1", "@angular/core": "^2.3.1", "@angular/forms": "^2.3.1", "@angular/http": "^2.3.1", "@angular/platform-browser": "^2.3.1", "@angular/platform-browser-dynamic": "^2.3.1", "@angular/router": "^3.3.1", "@ng-bootstrap/ng-bootstrap": "^1.0.0-alpha.18", "angularfire2": "^2.0.0-beta.7", "bootstrap": "^4.0.0-alpha.6", "bootstrap-datepicker": "^1.6.4", "core-js": "^2.4.1", "firebase": "^3.6.6", "jquery": "^3.1.1", "ng2-datetime": "^1.2.2", "ng2-datetime-picker": "^0.12.7", "ng2-file-upload": "^1.2.0", "rxjs": "^5.0.1", "ts-helpers": "^1.1.1", "zone.js": "^0.7.2" }, "devDependencies": { "@angular/compiler-cli": "^2.3.1", "@types/jasmine": "2.5.38", "@types/jquery": "^2.0.39", "@types/node": "^6.0.42", "angular-cli": "1.0.0-beta.24", "codelyzer": "~2.0.0-beta.1", "jasmine-core": "2.5.2", "jasmine-spec-reporter": "2.5.0", "karma": "1.2.0", "karma-chrome-launcher": "^2.0.0", "karma-cli": "^1.0.1", "karma-jasmine": "^1.0.2", "karma-remap-istanbul": "^0.2.1", "protractor": "~4.0.13", "ts-node": "1.2.1", "tslint": "^4.0.2", "typescript": "~2.0.3" } } 

My folder structure

+5
source share
2 answers

You need to import jquery using angular-cli . Modify the angular-cli.json .

Find the script array and add jquery.

 "scripts": [ "../node_modules/jquery/dist/jquery.min.js" ], 
+30
source

Spent a good amount of time, this is what I did, not help .

 npm uninstall -g angular-cli npm uninstall -g @angular/cli npm cache clear --force npm cache clean npm install -g @angular/cli 

and all other ordinary things

  • clear browser cache
  • restart browser
  • kill and restart ng serve

In my case, I had to do the following:

 npm install --save @types/jquery 

Import jquery into .angular-cli.json

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

change code from

 import $ from 'jquery'; 

to

 import * as jquery from 'jquery'; 

Note: the problem started after angular upgrade from 4.2 to 5.2

+3
source

Source: https://habr.com/ru/post/1263191/


All Articles