TypeError: Object(…) is not a function at eval (platform.es5.js:79) at eval (platform.es5.js:81)

All we need is an easy explanation of the problem, so here it is.

I am getting the following error :

platform.es5.js:79 Uncaught TypeError: Object(...) is not a function
    at eval (platform.es5.js:79)
    at eval (platform.es5.js:81)
    at Object../node_modules/@angular/cdk/esm5/platform.es5.js (vendor.bundle.js:63)
    at __webpack_require__ (inline.bundle.js:55)
    at eval (a11y.es5.js:33)
    at Object../node_modules/@angular/cdk/esm5/a11y.es5.js (vendor.bundle.js:23)
    at __webpack_require__ (inline.bundle.js:55)
    at eval (checkbox.es5.js:14)
    at Object../node_modules/@angular/material/esm5/checkbox.es5.js (vendor.bundle.js:111)
    at __webpack_require__ (inline.bundle.js:55)

I am also getting a bunch of warnings:

(anonymous) @ platform.es5.js:79
(anonymous) @ platform.es5.js:81
./node_modules/@angular/cdk/esm5/platform.es5.js @ vendor.bundle.js:63
__webpack_require__ @ inline.bundle.js:55
(anonymous) @ a11y.es5.js:33
./node_modules/@angular/cdk/esm5/a11y.es5.js @ vendor.bundle.js:23
__webpack_require__ @ inline.bundle.js:55
(anonymous) @ checkbox.es5.js:14
./node_modules/@angular/material/esm5/checkbox.es5.js @ vendor.bundle.js:111
__webpack_require__ @ inline.bundle.js:55
(anonymous) @ app.module.ts:3
./src/app/app.module.ts @ main.bundle.js:43
__webpack_require__ @ inline.bundle.js:55
(anonymous) @ main.ts:4
./src/main.ts @ main.bundle.js:235
__webpack_require__ @ inline.bundle.js:55
0 @ main.bundle.js:251
__webpack_require__ @ inline.bundle.js:55
webpackJsonpCallback @ inline.bundle.js:26
(anonymous) @ main.bundle.js:1
client:147 [WDS] Warnings while compiling.
warnings @ client:147
onmessage @ socket.js:41
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:883
SockJS._transportMessage @ sockjs.js:881
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2957
wrapFn @ zone.js:1188
ZoneDelegate.invokeTask @ zone.js:421
Zone.runTask @ zone.js:188
ZoneTask.invokeTask @ zone.js:496
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
client:153 ./node_modules/@angular/cdk/esm5/a11y.es5.js
1119:164-170 "export 'inject' was not found in '@angular/core'
 @ ./node_modules/@angular/cdk/esm5/a11y.es5.js
 @ ./node_modules/@angular/material/esm5/checkbox.es5.js
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi (webpack)-dev-server/client?http://0.0.0.0:0 ./src/main.ts
warnings @ client:153
onmessage @ socket.js:41
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:883
SockJS._transportMessage @ sockjs.js:881
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2957
wrapFn @ zone.js:1188
ZoneDelegate.invokeTask @ zone.js:421
Zone.runTask @ zone.js:188
ZoneTask.invokeTask @ zone.js:496
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
client:153 ./node_modules/@angular/cdk/esm5/a11y.es5.js
1119:62-78 "export 'defineInjectable' was not found in '@angular/core'
 @ ./node_modules/@angular/cdk/esm5/a11y.es5.js
 @ ./node_modules/@angular/material/esm5/checkbox.es5.js
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi (webpack)-dev-server/client?http://0.0.0.0:0 ./src/main.ts
warnings @ client:153
onmessage @ socket.js:41
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:883
SockJS._transportMessage @ sockjs.js:881
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2957
wrapFn @ zone.js:1188
ZoneDelegate.invokeTask @ zone.js:421
Zone.runTask @ zone.js:188
ZoneTask.invokeTask @ zone.js:496
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
client:153 ./node_modules/@angular/material/esm5/core.es5.js
1334:59-75 "export 'defineInjectable' was not found in '@angular/core'
 @ ./node_modules/@angular/material/esm5/core.es5.js
 @ ./node_modules/@angular/material/esm5/checkbox.es5.js
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi (webpack)-dev-server/client?http://0.0.0.0:0 ./src/main.ts
warnings @ client:153
onmessage @ socket.js:41
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:883
SockJS._transportMessage @ sockjs.js:881
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2957
wrapFn @ zone.js:1188
ZoneDelegate.invokeTask @ zone.js:421
Zone.runTask @ zone.js:188
ZoneTask.invokeTask @ zone.js:496
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
client:153 ./node_modules/@angular/cdk/esm5/observers.es5.js
164:149-155 "export 'inject' was not found in '@angular/core'
 @ ./node_modules/@angular/cdk/esm5/observers.es5.js
 @ ./node_modules/@angular/material/esm5/checkbox.es5.js
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi (webpack)-dev-server/client?http://0.0.0.0:0 ./src/main.ts
warnings @ client:153
onmessage @ socket.js:41
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:883
SockJS._transportMessage @ sockjs.js:881
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2957
wrapFn @ zone.js:1188
ZoneDelegate.invokeTask @ zone.js:421
Zone.runTask @ zone.js:188
ZoneTask.invokeTask @ zone.js:496
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
client:153 ./node_modules/@angular/cdk/esm5/observers.es5.js
164:57-73 "export 'defineInjectable' was not found in '@angular/core'
 @ ./node_modules/@angular/cdk/esm5/observers.es5.js
 @ ./node_modules/@angular/material/esm5/checkbox.es5.js
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi (webpack)-dev-server/client?http://0.0.0.0:0 ./src/main.ts
warnings @ client:153
onmessage @ socket.js:41
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:883
SockJS._transportMessage @ sockjs.js:881
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2957
wrapFn @ zone.js:1188
ZoneDelegate.invokeTask @ zone.js:421
Zone.runTask @ zone.js:188
ZoneTask.invokeTask @ zone.js:496
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
client:153 ./node_modules/@angular/cdk/esm5/a11y.es5.js
1666:152-158 "export 'inject' was not found in '@angular/core'
 @ ./node_modules/@angular/cdk/esm5/a11y.es5.js
 @ ./node_modules/@angular/material/esm5/checkbox.es5.js
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi (webpack)-dev-server/client?http://0.0.0.0:0 ./src/main.ts
warnings @ client:153
onmessage @ socket.js:41
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:883
SockJS._transportMessage @ sockjs.js:881
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2957
wrapFn @ zone.js:1188
ZoneDelegate.invokeTask @ zone.js:421
Zone.runTask @ zone.js:188
ZoneTask.invokeTask @ zone.js:496
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
client:153 ./node_modules/@angular/cdk/esm5/a11y.es5.js
1666:182-188 "export 'inject' was not found in '@angular/core'
 @ ./node_modules/@angular/cdk/esm5/a11y.es5.js
 @ ./node_modules/@angular/material/esm5/checkbox.es5.js
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi (webpack)-dev-server/client?http://0.0.0.0:0 ./src/main.ts
warnings @ client:153
onmessage @ socket.js:41
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:883
SockJS._transportMessage @ sockjs.js:881
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2957
wrapFn @ zone.js:1188
ZoneDelegate.invokeTask @ zone.js:421
Zone.runTask @ zone.js:188
ZoneTask.invokeTask @ zone.js:496
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
client:153 ./node_modules/@angular/cdk/esm5/a11y.es5.js
1666:198-204 "export 'inject' was not found in '@angular/core'
 @ ./node_modules/@angular/cdk/esm5/a11y.es5.js
 @ ./node_modules/@angular/material/esm5/checkbox.es5.js
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi (webpack)-dev-server/client?http://0.0.0.0:0 ./src/main.ts
warnings @ client:153
onmessage @ socket.js:41
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:883
SockJS._transportMessage @ sockjs.js:881
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2957
wrapFn @ zone.js:1188
ZoneDelegate.invokeTask @ zone.js:421
Zone.runTask @ zone.js:188
ZoneTask.invokeTask @ zone.js:496
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
client:153 ./node_modules/@angular/cdk/esm5/a11y.es5.js
1666:58-74 "export 'defineInjectable' was not found in '@angular/core'
 @ ./node_modules/@angular/cdk/esm5/a11y.es5.js
 @ ./node_modules/@angular/material/esm5/checkbox.es5.js
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi (webpack)-dev-server/client?http://0.0.0.0:0 ./src/main.ts
warnings @ client:153
onmessage @ socket.js:41
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:883
SockJS._transportMessage @ sockjs.js:881
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2957
wrapFn @ zone.js:1188
ZoneDelegate.invokeTask @ zone.js:421
Zone.runTask @ zone.js:188
ZoneTask.invokeTask @ zone.js:496
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
client:153 ./node_modules/@angular/cdk/esm5/a11y.es5.js
1858:143-149 "export 'inject' was not found in '@angular/core'
 @ ./node_modules/@angular/cdk/esm5/a11y.es5.js
 @ ./node_modules/@angular/material/esm5/checkbox.es5.js
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi (webpack)-dev-server/client?http://0.0.0.0:0 ./src/main.ts
warnings @ client:153
onmessage @ socket.js:41
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:883
SockJS._transportMessage @ sockjs.js:881
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2957
wrapFn @ zone.js:1188
ZoneDelegate.invokeTask @ zone.js:421
Zone.runTask @ zone.js:188
ZoneTask.invokeTask @ zone.js:496
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
client:153 ./node_modules/@angular/cdk/esm5/a11y.es5.js
1858:184-190 "export 'inject' was not found in '@angular/core'
 @ ./node_modules/@angular/cdk/esm5/a11y.es5.js
 @ ./node_modules/@angular/material/esm5/checkbox.es5.js
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi (webpack)-dev-server/client?http://0.0.0.0:0 ./src/main.ts
warnings @ client:153
onmessage @ socket.js:41
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:883
SockJS._transportMessage @ sockjs.js:881
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2957
wrapFn @ zone.js:1188
ZoneDelegate.invokeTask @ zone.js:421
Zone.runTask @ zone.js:188
ZoneTask.invokeTask @ zone.js:496
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
client:153 ./node_modules/@angular/cdk/esm5/a11y.es5.js
1858:55-71 "export 'defineInjectable' was not found in '@angular/core'
 @ ./node_modules/@angular/cdk/esm5/a11y.es5.js
 @ ./node_modules/@angular/material/esm5/checkbox.es5.js
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi (webpack)-dev-server/client?http://0.0.0.0:0 ./src/main.ts
warnings @ client:153
onmessage @ socket.js:41
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:883
SockJS._transportMessage @ sockjs.js:881
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2957
wrapFn @ zone.js:1188
ZoneDelegate.invokeTask @ zone.js:421
Zone.runTask @ zone.js:188
ZoneTask.invokeTask @ zone.js:496
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
client:153 ./node_modules/@angular/material/esm5/core.es5.js
2107:83-104 "export 'ANIMATION_MODULE_TYPE' was not found in '@angular/platform-browser/animations'
 @ ./node_modules/@angular/material/esm5/core.es5.js
 @ ./node_modules/@angular/material/esm5/checkbox.es5.js
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi (webpack)-dev-server/client?http://0.0.0.0:0 ./src/main.ts
warnings @ client:153
onmessage @ socket.js:41
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:883
SockJS._transportMessage @ sockjs.js:881
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2957
wrapFn @ zone.js:1188
ZoneDelegate.invokeTask @ zone.js:421
Zone.runTask @ zone.js:188
ZoneTask.invokeTask @ zone.js:496
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
client:153 ./node_modules/@angular/cdk/esm5/a11y.es5.js
2305:140-146 "export 'inject' was not found in '@angular/core'
 @ ./node_modules/@angular/cdk/esm5/a11y.es5.js
 @ ./node_modules/@angular/material/esm5/checkbox.es5.js
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi (webpack)-dev-server/client?http://0.0.0.0:0 ./src/main.ts
warnings @ client:153
onmessage @ socket.js:41
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:883
SockJS._transportMessage @ sockjs.js:881
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2957
wrapFn @ zone.js:1188
ZoneDelegate.invokeTask @ zone.js:421
Zone.runTask @ zone.js:188
ZoneTask.invokeTask @ zone.js:496
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
client:153 ./node_modules/@angular/cdk/esm5/a11y.es5.js
2305:156-162 "export 'inject' was not found in '@angular/core'
 @ ./node_modules/@angular/cdk/esm5/a11y.es5.js
 @ ./node_modules/@angular/material/esm5/checkbox.es5.js
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi (webpack)-dev-server/client?http://0.0.0.0:0 ./src/main.ts
warnings @ client:153
onmessage @ socket.js:41
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:883
SockJS._transportMessage @ sockjs.js:881
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2957
wrapFn @ zone.js:1188
ZoneDelegate.invokeTask @ zone.js:421
Zone.runTask @ zone.js:188
ZoneTask.invokeTask @ zone.js:496
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
client:153 ./node_modules/@angular/cdk/esm5/a11y.es5.js
2305:54-70 "export 'defineInjectable' was not found in '@angular/core'
 @ ./node_modules/@angular/cdk/esm5/a11y.es5.js
 @ ./node_modules/@angular/material/esm5/checkbox.es5.js
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi (webpack)-dev-server/client?http://0.0.0.0:0 ./src/main.ts
warnings @ client:153
onmessage @ socket.js:41
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:883
SockJS._transportMessage @ sockjs.js:881
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2957
wrapFn @ zone.js:1188
ZoneDelegate.invokeTask @ zone.js:421
Zone.runTask @ zone.js:188
ZoneTask.invokeTask @ zone.js:496
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
client:153 ./node_modules/@angular/cdk/esm5/a11y.es5.js
353:143-149 "export 'inject' was not found in '@angular/core'
 @ ./node_modules/@angular/cdk/esm5/a11y.es5.js
 @ ./node_modules/@angular/material/esm5/checkbox.es5.js
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi (webpack)-dev-server/client?http://0.0.0.0:0 ./src/main.ts
warnings @ client:153
onmessage @ socket.js:41
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:883
SockJS._transportMessage @ sockjs.js:881
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2957
wrapFn @ zone.js:1188
ZoneDelegate.invokeTask @ zone.js:421
Zone.runTask @ zone.js:188
ZoneTask.invokeTask @ zone.js:496
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
client:153 ./node_modules/@angular/cdk/esm5/a11y.es5.js
353:55-71 "export 'defineInjectable' was not found in '@angular/core'
 @ ./node_modules/@angular/cdk/esm5/a11y.es5.js
 @ ./node_modules/@angular/material/esm5/checkbox.es5.js
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi (webpack)-dev-server/client?http://0.0.0.0:0 ./src/main.ts
warnings @ client:153
onmessage @ socket.js:41
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:883
SockJS._transportMessage @ sockjs.js:881
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2957
wrapFn @ zone.js:1188
ZoneDelegate.invokeTask @ zone.js:421
Zone.runTask @ zone.js:188
ZoneTask.invokeTask @ zone.js:496
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
client:153 ./node_modules/@angular/cdk/esm5/observers.es5.js
38:65-81 "export 'defineInjectable' was not found in '@angular/core'
 @ ./node_modules/@angular/cdk/esm5/observers.es5.js
 @ ./node_modules/@angular/material/esm5/checkbox.es5.js
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi (webpack)-dev-server/client?http://0.0.0.0:0 ./src/main.ts
warnings @ client:153
onmessage @ socket.js:41
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:883
SockJS._transportMessage @ sockjs.js:881
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2957
wrapFn @ zone.js:1188
ZoneDelegate.invokeTask @ zone.js:421
Zone.runTask @ zone.js:188
ZoneTask.invokeTask @ zone.js:496
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
client:153 ./node_modules/@angular/cdk/esm5/bidi.es5.js
39:11-17 "export 'inject' was not found in '@angular/core'
 @ ./node_modules/@angular/cdk/esm5/bidi.es5.js
 @ ./node_modules/@angular/material/esm5/core.es5.js
 @ ./node_modules/@angular/material/esm5/checkbox.es5.js
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi (webpack)-dev-server/client?http://0.0.0.0:0 ./src/main.ts
warnings @ client:153
onmessage @ socket.js:41
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:883
SockJS._transportMessage @ sockjs.js:881
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2957
wrapFn @ zone.js:1188
ZoneDelegate.invokeTask @ zone.js:421
Zone.runTask @ zone.js:188
ZoneTask.invokeTask @ zone.js:496
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
client:153 ./node_modules/@angular/material/esm5/core.es5.js
525:11-17 "export 'inject' was not found in '@angular/core'
 @ ./node_modules/@angular/material/esm5/core.es5.js
 @ ./node_modules/@angular/material/esm5/checkbox.es5.js
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi (webpack)-dev-server/client?http://0.0.0.0:0 ./src/main.ts
warnings @ client:153
onmessage @ socket.js:41
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:883
SockJS._transportMessage @ sockjs.js:881
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2957
wrapFn @ zone.js:1188
ZoneDelegate.invokeTask @ zone.js:421
Zone.runTask @ zone.js:188
ZoneTask.invokeTask @ zone.js:496
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
client:153 ./node_modules/@angular/material/esm5/checkbox.es5.js
561:83-104 "export 'ANIMATION_MODULE_TYPE' was not found in '@angular/platform-browser/animations'
 @ ./node_modules/@angular/material/esm5/checkbox.es5.js
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi (webpack)-dev-server/client?http://0.0.0.0:0 ./src/main.ts
warnings @ client:153
onmessage @ socket.js:41
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:883
SockJS._transportMessage @ sockjs.js:881
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2957
wrapFn @ zone.js:1188
ZoneDelegate.invokeTask @ zone.js:421
Zone.runTask @ zone.js:188
ZoneTask.invokeTask @ zone.js:496
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
client:153 ./node_modules/@angular/cdk/esm5/platform.es5.js
79:128-134 "export 'inject' was not found in '@angular/core'
 @ ./node_modules/@angular/cdk/esm5/platform.es5.js
 @ ./node_modules/@angular/material/esm5/core.es5.js
 @ ./node_modules/@angular/material/esm5/checkbox.es5.js
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi (webpack)-dev-server/client?http://0.0.0.0:0 ./src/main.ts
warnings @ client:153
onmessage @ socket.js:41
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:883
SockJS._transportMessage @ sockjs.js:881
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2957
wrapFn @ zone.js:1188
ZoneDelegate.invokeTask @ zone.js:421
Zone.runTask @ zone.js:188
ZoneTask.invokeTask @ zone.js:496
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
client:153 ./node_modules/@angular/cdk/esm5/platform.es5.js
79:50-66 "export 'defineInjectable' was not found in '@angular/core'
 @ ./node_modules/@angular/cdk/esm5/platform.es5.js
 @ ./node_modules/@angular/material/esm5/core.es5.js
 @ ./node_modules/@angular/material/esm5/checkbox.es5.js
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi (webpack)-dev-server/client?http://0.0.0.0:0 ./src/main.ts
warnings @ client:153
onmessage @ socket.js:41
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:883
SockJS._transportMessage @ sockjs.js:881
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2957
wrapFn @ zone.js:1188
ZoneDelegate.invokeTask @ zone.js:421
Zone.runTask @ zone.js:188
ZoneTask.invokeTask @ zone.js:496
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
client:153 ./node_modules/@angular/cdk/esm5/bidi.es5.js
86:146-152 "export 'inject' was not found in '@angular/core'
 @ ./node_modules/@angular/cdk/esm5/bidi.es5.js
 @ ./node_modules/@angular/material/esm5/core.es5.js
 @ ./node_modules/@angular/material/esm5/checkbox.es5.js
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi (webpack)-dev-server/client?http://0.0.0.0:0 ./src/main.ts
warnings @ client:153
onmessage @ socket.js:41
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:883
SockJS._transportMessage @ sockjs.js:881
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2957
wrapFn @ zone.js:1188
ZoneDelegate.invokeTask @ zone.js:421
Zone.runTask @ zone.js:188
ZoneTask.invokeTask @ zone.js:496
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
client:153 ./node_modules/@angular/cdk/esm5/bidi.es5.js
86:56-72 "export 'defineInjectable' was not found in '@angular/core'
 @ ./node_modules/@angular/cdk/esm5/bidi.es5.js
 @ ./node_modules/@angular/material/esm5/core.es5.js
 @ ./node_modules/@angular/material/esm5/checkbox.es5.js
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi (webpack)-dev-server/client?http://0.0.0.0:0 ./src/main.ts
warnings @ client:153
onmessage @ socket.js:41
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:883
SockJS._transportMessage @ sockjs.js:881
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2957
wrapFn @ zone.js:1188
ZoneDelegate.invokeTask @ zone.js:421
Zone.runTask @ zone.js:188
ZoneTask.invokeTask @ zone.js:496
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566

My app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
import {MatCheckboxModule} from '@angular/material/checkbox';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import {RouterModule, Routes} from '@angular/router';
import { FlashMessagesModule } from 'ngx-flash-messages';


import { AppComponent } from './app.component';
import { ClientComponent } from './client/client.component';
import { CompanyComponent } from './company/company.component';
import { ContactComponent } from './contact/contact.component';
import { HomeComponent } from './home/home.component';
import { LeftSideBarComponent } from './left-side-bar/left-side-bar.component';
import { NavbarComponent } from './navbar/navbar.component';
import { RoleComponent } from './role/role.component';
import { UserComponent } from './user/user.component';

const appRoutes: Routes =  [
  {path:'', component: HomeComponent},
  {path:'contact', component: ContactComponent},
  {path:'company', component:CompanyComponent},
  {path:'user', component:UserComponent},
  {path:'role', component:RoleComponent},
  {path:'client', component:ClientComponent}
]

@NgModule({
  declarations: [
    AppComponent,
    ClientComponent,
    CompanyComponent,
    ContactComponent,
    HomeComponent,
    LeftSideBarComponent,
    NavbarComponent,
    RoleComponent,
    UserComponent
  ],
  imports: [
    BrowserModule,
    BrowserAnimationsModule,
    MatCheckboxModule,
    FormsModule,
    HttpModule,
    FlashMessagesModule,
    RouterModule.forRoot(appRoutes)
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

My package.json

{
  "name": "admin-app",
  "version": "0.0.0",
  "license": "MIT",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build --prod",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^5.2.11",
    "@angular/cdk": "^6.1.0",
    "@angular/common": "^5.2.0",
    "@angular/compiler": "^5.2.0",
    "@angular/core": "^5.2.0",
    "@angular/forms": "^5.2.0",
    "@angular/http": "^5.2.0",
    "@angular/material": "^6.1.0",
    "@angular/platform-browser": "^5.2.0",
    "@angular/platform-browser-dynamic": "^5.2.0",
    "@angular/router": "^5.2.0",
    "core-js": "^2.4.1",
    "hammerjs": "^2.0.8",
    "rxjs": "^5.5.6",
    "zone.js": "^0.8.19"
  },
  "devDependencies": {
    "@angular/cli": "~1.7.4",
    "@angular/compiler-cli": "^5.2.0",
    "@angular/language-service": "^5.2.0",
    "@types/jasmine": "~2.8.3",
    "@types/jasminewd2": "~2.0.2",
    "@types/node": "~6.0.60",
    "codelyzer": "^4.0.1",
    "jasmine-core": "~2.8.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~2.0.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "^1.2.1",
    "karma-jasmine": "~1.1.0",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "~5.1.2",
    "ts-node": "~4.1.0",
    "tslint": "~5.9.1",
    "typescript": "~2.5.3"
  }
}

I want to use angular material, but I can not as I am repeatedly getting such errors. I am following the documentations and tutorial videos.

How to solve :

I know you bored from this bug, So we are here to help you! Take a deep breath and look at the explanation of your problem. We have many solutions to this problem, But we recommend you to use the first method because it is tested & true method that will 100% work for you.

Method 1

You can’t use @angular/material and @angular/cdk version 6.1.0 since your angular dependencies is still at 5.2.0

download the version 5.2.0

npm install @angular/[email protected]

And also keep your angular dependencies on a same version, your @angular/animations is at 5.2.11 where it should be 5.2.0

Method 2

I had a similar error message, which appears to be caused by version 8 modules being used with Angular 7. The solution for me was to go through package.json looking for version 8 modules (in my case, @angular/cdk and @angular/material), changing them to the most recent version 7 modules, and then re-running npm i

Method 3

   {
  "name": "my-blog",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "7.2.1",
    "@angular/cdk": "7.2.1",
    "@angular/common": "~7.1.0",
    "@angular/compiler": "~7.1.0",
    "@angular/core": "~7.1.0",
    "@angular/forms": "~7.1.0",
    "@angular/material": "7.2.1",
    "@angular/platform-browser": "~7.1.0",
    "@angular/platform-browser-dynamic": "~7.1.0",
    "@angular/flex-layout": "7.0.0-beta.22",
    "@angular/router": "~7.1.0",
    "core-js": "^2.5.4",
    "rxjs": "~6.3.3",
    "tslib": "^1.9.0",
    "zone.js": "~0.8.26"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.11.0",
    "@angular/cli": "~7.1.1",
    "@angular/compiler-cli": "~7.1.0",
    "@angular/language-service": "~7.1.0",
    "@types/node": "~8.9.4",
    "@types/jasmine": "~2.8.8",
    "@types/jasminewd2": "~2.0.3",
    "codelyzer": "~4.5.0",
    "jasmine-core": "~2.99.1",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~3.1.1",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.1",
    "karma-jasmine": "~1.1.2",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "~5.4.0",
    "ts-node": "~7.0.0",
    "tslint": "~5.11.0",
    "typescript": "~3.1.6"
  }
}

Make sure “@angular/animations” , “@angular/cdk” and “@angular/material” are in same version .Remove ^ symbole and save package.json . At last do npm install .It will solve the issue.

Method 4

The reason of behind this, your current angularCLI version and you’re current
angular/material version & angular/CDK version. Please check it.

like: Angular CLI version (7.4) and angular/material version(8.1)…..so both are not the same path.

change your angular/material version & angular/cdk version in package.json file.

Example:- “@angular/material”: “7.2.1”,
“@angular/cdk”: “7.2.1”,
in package.json file.

After that run this command = npm install

Method 5

That works for me.
I changed them to the follows:

“@angular/animations”: “^7.2.10”

“@angular/cdk”: “^7.3.1”

“@angular/material”: “^7.3.7”

Using:

After that I enter: npm i

And the issue was fixed

Method 6

After downgraded the flex-layout, It works for me.
I have downgraded flex-layout to 7.0.0-beta.24 version

npm install @angular/[email protected]

as I have package.json like below

"@angular/animations": "~7.2.0",
"@angular/cdk": "~7.3.7",
"@angular/common": "~7.2.0",
"@angular/compiler": "~7.2.0",
"@angular/core": "~7.2.0",
"@angular/flex-layout": "^7.0.0-beta.24",
"@angular/forms": "~7.2.0",
"@angular/material": "^7.3.7",
"@angular/platform-browser": "~7.2.0",
"@angular/platform-browser-dynamic": "~7.2.0",
"@angular/router": "~7.2.0",
"core-js": "^2.5.4",
"hammerjs": "^2.0.8",
"ngx-device-detector": "^1.3.6",
"rxjs": "~6.3.3",
"tslib": "^1.9.0",
"zone.js": "~0.8.26"

Method 7

Update your material like this:- npm install –save @angular/[email protected] @angular/[email protected] @angular/[email protected]
this will work properly

Note: Use and implement method 1 because this method fully tested our system.
Thank you 🙂

All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply