Error in angular 2 module not found: cant resolve '.app

narasiman rao

File structure as follows

->src

->app

->appcomponent.css

->appcomponent.html

->appcomponent.spec.ts

->appcomponent.ts

i written the below code in visual studio code

App.component.ts code as follows

import { Component } from '@angular/core';

@Component({

selector: 'my-app',

templateUrl: 'app/app.component.html'

})

export class AppComponent {

appTitle: string = 'Welcome';

appStatus: boolean = true;

}

app.component.html code as follows

{{appTitle}} Tutorialspoint

when i run in browser error as follows

ERROR in ./src/app/app.componenet.ts

Module not found: Error cant resolve '.app/app.component.html' in 'C:\users\1900055\tour\src\app

resolve './app/app.component.html' in 'C:\users\1900055\tour\src\app'

using description file: C:\users\1900055\package.json

Field browser does not contain a valid false configuration.

what is the mistake in above code.

please help me

5 Replies

Know the answer? Post it — somebody with the same question will find it here.

Laxmidhar Sahoo9y ago
sir can show the root folder name
and then subfolders
0
Laxmidhar Sahoo9y ago
sir change from '.app/app.component.html'

to

'component.html'

This may work
0
Dharmraj Thakur9y ago
Replace Your main.ts with following code...
import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

import { AppModule } from './app/app.module';

platformBrowserDynamic().bootstrapModule(AppModule);

Still not working then please check by changin of index.html
0
narasiman rao9y ago
App.module.ts code as follows

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }

Main.ts code as follows

import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app/app.module';
import { environment } from './environments/environment';
if (environment.production) {
enableProdMode();
}
platformBrowserDynamic().bootstrapModule(AppModule)
.catch(err => console.log(err));

i send the code of main.ts and app.module.ts.
0
Dharmraj Thakur9y ago
Code is correct, there is no any mistake. please show your main.ts, appModule.ts and
0