Can't register material icons anymore with version 5

Bug, feature request, or proposal:

Bug Report

I’m using an Angular 5 project and have installed material @angular/cdk@^5.0.0-rc0 + @angular/material@^5.0.0-rc0. When I try to register custom SVG Icons for Mat-Icon, I get the error:

ERROR in Metadata version mismatch for module /Users/Me/dev/project/node_modules/@angular/material/core/typings/index.d.ts, found version 4, expected 3, resolving symbol AppSharedModule.

What is the expected behavior?

I would like to be able to register my svg Icons with IconRegistry of Material design without the version error.

constructor(iconRegistry: MatIconRegistry, sanitizer: DomSanitizer) {
    iconRegistry
    .addSvgIcon('my-icon',
        sanitizer.bypassSecurityTrustResourceUrl('/assets/svg/my-icon.svg'));
}

What is the current behavior?

The app throws the error:

ERROR in Metadata version mismatch for module /Users/Me/dev/project/node_modules/@angular/material/core/typings/index.d.ts, found version 4, expected 3, resolving symbol AppSharedModule.

What are the steps to reproduce?

Use Angular 5

    "@angular/animations": "^5.0.0",
    "@angular/cdk": "^5.0.0-rc0",
    "@angular/common": "^5.0.0",
    "@angular/compiler": "^5.0.0",
    "@angular/core": "^5.0.0",
    "@angular/forms": "^5.0.0",
    "@angular/http": "^5.0.0",
    "@angular/material": "^5.0.0-rc0",
    "@angular/platform-browser": "^5.0.0",
    "@angular/platform-browser-dynamic": "^5.0.0",
    "@angular/router": "^5.0.0",

Try to register icons e.g. AppModule/AppShared

export class MyClass {
    constructor(iconRegistry: MatIconRegistry, sanitizer: DomSanitizer) {
        iconRegistry
         .addSvgIcon('my-icon',
            sanitizer.bypassSecurityTrustResourceUrl('/assets/svg/my-icon.svg'));
    }
}

Npm start

npm start

What is the use-case or motivation for changing an existing behavior?

Get the project working

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

@angular/animations: 4.4.3 @angular/cdk: 5.0.0-rc0 @angular/common: 4.4.3 @angular/compiler: 4.4.3 @angular/core: 4.4.3 @angular/forms: 4.4.3 @angular/http: 4.4.3 @angular/material: 5.0.0-rc0 @angular/platform-browser: 4.4.3 @angular/platform-browser-dynamic: 4.4.3 @angular/router: 4.4.3 @angular/cli: 1.3.2 @angular/compiler-cli: 4.4.3 @angular/language-service: 4.4.3

[EdricChan03]

@ORESoftware First import is correct. Second import should be:

import {DomSanitizer} from '@angular/platform-browser';

[Jonathan002]

Yeah I just found out now that there was something wrong with my npm. Even though I asked for Angular 5 in my package.json, each npm install gave me Angular 4. It was only until I removed my package-lock.json, was when npm successfully installed Angular 5. I now have the app running without this issue anymore. Thanks for the comments. : )