Angular 4 CLI cannot find name 'jasmine' - karma-jasmine

Question

I am using the Angular 4 CLI (v.1.0.0) and to handle testing I created some mocks that use jasmine to create a spy. In the IDE everything looks okay, however in the terminal I am getting and error that says "Cannot find name 'jasmine'".
At first I thought the issue was that jasmine wasn't added to the typings but I can see that package.json includes the import for the jasmine type def so I'm not sure what is missing.
mocks.ts
export class MockAuthService {
public login: Function = jasmine.createSpy('login');
}
export class MockHttpService {
public delete: Function = jasmine.createSpy('delete');
public get: Function = jasmine.createSpy('get');
public post: Function = jasmine.createSpy('post');
public put: Function = jasmine.createSpy('put');
}
running ng serve returns the following error messages in the terminal.
ERROR in C:/Users/efarley/Desktop/repos/prod/src/app/mocks/mocks.ts
(2,23): Cannot find name 'jasmine'.
C:/Users/efarley/Desktop/repos/prod/src/app/mocks/mocks.ts (6,24):
Cannot find name 'jasmine'.
C:/Users/efarley/Desktop/repos/prod/src/app/mocks/mocks.ts (7,21):
Cannot find name 'jasmine'.
C:/Users/efarley/Desktop/repos/prod/src/app/mocks/mocks.ts (8,22):
Cannot find name 'jasmine'.
C:/Users/efarley/Desktop/repos/prod/src/app/mocks/mocks.ts (9,21):
Cannot find name 'jasmine'.
webpack: Failed to compile.
tsconfig.json
{
"compileOnSave": false,
"compilerOptions": {
"outDir": "./dist/out-tsc",
"baseUrl": "src",
"sourceMap": true,
"declaration": false,
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"target": "es5",
"typeRoots": [
"node_modules/#types"
],
"lib": [
"es2016",
"dom"
]
}
}
tsconfig.spec.json
{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../out-tsc/spec",
"module": "commonjs",
"target": "es5",
"baseUrl": "",
"types": [
"jasmine",
"node"
]
},
"files": [
"test.ts"
],
"include": [
"**/*.spec.ts",
"**/*.d.ts"
]
}
tsconfig.app.json
{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../out-tsc/app",
"module": "es2015",
"baseUrl": "",
"types": []
},
"exclude": [
"test.ts",
"**/*.spec.ts"
]
}
package.json
{
"name": "prod",
"version": "0.0.0",
"license": "MIT",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"#angular/animations": "^4.0.2",
"#angular/common": "^4.0.0",
"#angular/compiler": "^4.0.0",
"#angular/core": "^4.0.0",
"#angular/flex-layout": "^2.0.0-beta.8",
"#angular/forms": "^4.0.0",
"#angular/http": "^4.0.0",
"#angular/material": "^2.0.0-beta.3",
"#angular/platform-browser": "^4.0.0",
"#angular/platform-browser-dynamic": "^4.0.0",
"#angular/router": "^4.0.0",
"core-js": "^2.4.1",
"rxjs": "^5.1.0",
"zone.js": "^0.8.4"
},
"devDependencies": {
"#angular/cli": "1.0.0",
"#angular/compiler-cli": "^4.0.0",
"#types/jasmine": "2.5.38",
"#types/node": "~6.0.60",
"codelyzer": "~2.0.0",
"jasmine-core": "~2.5.2",
"jasmine-spec-reporter": "~3.2.0",
"karma": "~1.4.1",
"karma-chrome-launcher": "~2.0.0",
"karma-cli": "~1.0.1",
"karma-jasmine": "~1.1.0",
"karma-jasmine-html-reporter": "^0.2.2",
"karma-coverage-istanbul-reporter": "^0.2.0",
"protractor": "~5.1.0",
"ts-node": "~2.0.0",
"tslint": "~4.5.0",
"typescript": "~2.2.0"
}
}

Answer 1

You are getting the error because TypeScript is trying to include the mock in the app build, and the app (rightly) doesn't know about Jasmine.
Exclude the mock from your app compilation by adding it to the exclude array in tsconfig.app.json:
{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../out-tsc/app",
"module": "es2015",
"baseUrl": "",
"types": []
},
"exclude": [
"test.ts",
"**/*.spec.ts",
"**/*.mock.ts"
]
}

Answer 2

I am not sure if you should be creating jasmine spys that way, but regardless:
The issue is with your file name
notice: tsconfig.spec.json has: "include": ["**/*.spec.ts","**/*.d.ts"]
and your file name is mocks.ts.
either change the file name to mocks.spec.ts
or add "**/*.mock.ts" and rename to something like service.mock.ts
Hope this helps.