在Angular4中找不到'AppModule'的NgModule元數據我無法找到它在main.ts中顯示的原因

這裏是我的package.json文件，我對類型腳本和角色cli的版本有疑問，有些結果是還說紗線問題。在Angular4中找不到'AppModule'的NgModule元數據我無法找到它在main.ts中顯示的原因

{ 
    "name": "suntistfrontend", 
    "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.0", 
    "@angular/common": "^4.0.0", 
    "@angular/compiler": "^4.0.0", 
    "@angular/core": "^4.0.0", 
    "@angular/forms": "^4.0.0", 
    "@angular/http": "^4.0.0", 
    "@angular/platform-browser": "^4.0.0", 
    "@angular/platform-browser-dynamic": "^4.0.0", 
    "@angular/router": "^4.0.0", 
    "@uirouter/angular": "^1.0.0-beta.5", 
    "core-js": "^2.4.1", 
    "jquery": "^3.2.1", 
    "ngx-bootstrap": "^1.8.1", 
    "rxjs": "^5.1.0", 
    "ui-router-ng2": "^1.0.0-beta.5", 
    "zone.js": "^0.8.4" 
    }, 
    "devDependencies": { 
    "@angular/cli": "1.3.0", 
    "@angular/compiler-cli": "^4.0.0", 
    "@angular/language-service": "^4.0.0", 
    "@types/hammerjs": "^2.0.34", 
    "@types/jasmine": "~2.5.53", 
    "@types/jasminewd2": "~2.0.2", 
    "@types/jquery": "^3.2.10", 
    "@types/node": "~6.0.60", 
    "codelyzer": "~3.0.1", 
    "hammerjs": "^2.0.8", 
    "jasmine-core": "~2.6.2", 
    "jasmine-spec-reporter": "~4.1.0", 
    "karma": "~1.7.0", 
    "karma-chrome-launcher": "~2.1.1", 
    "karma-cli": "~1.0.1", 
    "karma-coverage-istanbul-reporter": "^1.2.1", 
    "karma-jasmine": "~1.1.0", 
    "karma-jasmine-html-reporter": "^0.2.2", 
    "node-sass": "^4.5.3", 
    "protractor": "~5.1.2", 
    "raw-loader": "^0.5.1", 
    "sass-loader": "^6.0.6", 
    "ts-node": "~3.0.4", 
    "tslint": "~5.3.2", 
    "typescript": "~2.3.3" 
    } 
}`

我main.ts文件：「控制檯顯示main.ts的最後一行的錯誤，是平臺的瀏覽器動態的（）」

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)/

這裏是app.module.ts文件：「看看是否導出導入引導或聲明的錯誤是有」 `

import { BrowserModule, Title} from '@angular/platform-browser'; 
import { NgModule } from '@angular/core'; 
import { HttpModule } from '@angular/http'; 
import { FormGroup,FormsModule, ReactiveFormsModule } from '@angular/forms'; 
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 
import { UIRouterModule } from '@uirouter/angular'; 
import { Location } from '@angular/common'; 

import { AppComponent } from './app.component'; 
import { HttprequestService } from './httprequest.service'; 
import { ShareDataService } from './share-data.service'; 
import { HomeComponent } from './home/home.component'; 
import { OurServicesComponent } from './our-services/our-services.component'; 
import { OurexperienceComponent } from './ourexperience/ourexperience.component'; 
import { AboutusComponent } from './aboutus/aboutus.component'; 
import { ContactUsComponent } from './contact-us/contact-us.component'; 
import { ServiceComponent } from './service/service.component'; 
import { HeaderComponent } from './header/header.component'; 
import { PathNotFoundComponent } from './path-not-found/path-not-found.component'; 
import { ExperienceComponent } from './experience/experience.component'; 
import { DemolinkPipe } from './demolink.pipe'; 
import { UrlSanitizerPipe } from './url-sanitizer.pipe'; 



let homeState = { name: 'home', url: '/', component: HomeComponent }; 
let servicesState = { name: 'services', url: '/services', component: OurServicesComponent }; 
let serviceState = { name: 'service', url: '/services/:serviceId', component: ServiceComponent }; 
let experiencesState = { name: 'experiences', url: '/experiences', component: OurexperienceComponent }; 
let experienceState = { name: 'experience', url: '/experiences/:experienceId', component: ExperienceComponent }; 
let contactState = { name: 'contact', url: '/contact', component: ContactUsComponent }; 
let aboutState = { name: 'about', url: '/about', component: AboutusComponent }; 
let notFound = { name: 'otherwise', path: '/404', component: PathNotFoundComponent }; 

NgModule({ 
    declarations: [ 
    AppComponent, 
    HomeComponent, 
    OurServicesComponent, 
    OurexperienceComponent, 
    AboutusComponent, 
    ContactUsComponent, 
    ServiceComponent, 
    HeaderComponent, 
    ExperienceComponent, 
    DemolinkPipe, 
    UrlSanitizerPipe, 
    PathNotFoundComponent 
    ], 
    imports: [ 
    BrowserModule, 
    HttpModule, 
    FormsModule, 
    ReactiveFormsModule, 
    UIRouterModule.forRoot({ 
     otherwise:"/404", 
     states: [ 
     homeState, 
     servicesState, 
     serviceState, 
     experiencesState, 
     experienceState, 
     contactState, 
     aboutState, 
     notFound 
     ], useHash: false }) 
    ], 
    providers: [HttprequestService, Location, Title, ShareDataService,], 
    bootstrap: [AppComponent] 
}) 
export class AppModule { }

這裏是angularcli.json：「我的核心項目，請解決我的問題，我不能夠找到」

{ 
    "$schema": "./node_modules/@angular/cli/lib/config/schema.json", 
    "project": { 
    "name": "suntistfrontend" 
    }, 
    "apps": [ 
    { 
     "root": "src", 
     "outDir": "dist", 
     "assets": [ 
     "assets", 
     "favicon.ico" 
     ], 
     "index": "index.html", 
     "main": "main.ts", 
     "polyfills": "polyfills.ts", 
     "test": "test.ts", 
     "tsconfig": "tsconfig.app.json", 
     "testTsconfig": "tsconfig.spec.json", 
     "prefix": "app", 
     "styles": [ 
     "styles.scss" 
     ], 
     "scripts": ["../node_modules/jquery/dist/jquery.js"], 
     "environmentSource": "environments/environment.ts", 

     "environments": { 
     "dev": "environments/environment.ts", 
     "prod": "environments/environment.prod.ts" 
     } 
    } 
    ], 
    "e2e": { 
    "protractor": { 
     "config": "./protractor.conf.js" 
    } 
    }, 
    "lint": [ 
    { 
     "project": "src/tsconfig.app.json" 
    }, 
    { 
     "project": "src/tsconfig.spec.json" 
    }, 
    { 
     "project": "e2e/tsconfig.e2e.json" 
    } 
    ], 
    "test": { 
    "karma": { 
     "config": "./karma.conf.js" 
    } 
    }, 


    "defaults": { 
    "styleExt": "css", 
    "component": {} 
    } 
}

這裏是app.component.ts

import { Component, OnInit , Injectable} from '@angular/core'; 
import { HttprequestService } from './httprequest.service'; 
import { Observable } from 'rxjs/Rx'; 
import { Subscription } from 'rxjs/Subscription'; 
import { Location } from '@angular/common'; 
import 'rxjs/Rx'; 
import 'rxjs/add/operator/map'; 
import { NgClass } from '@angular/common'; 
import { RouterLinkActive } from '@angular/router'; 
import { Title }  from '@angular/platform-browser'; 


@Injectable() 
@Component({ 
    selector: 'app-root', 
    templateUrl: './app.component.html', 
    styleUrls: ['./app.component.css'] 
}) 

export class AppComponent{ 
    navbardata = []; 
    path = "contact/social" 
    hiddenDiv :boolean = true ; 
    makeactive :boolean = false ; 
    dataloaded :boolean = false ; 
    constructor(private httpcustomservice: HttprequestService , 
       private location : Location , 
       private titleService: Title){} 

    public setTitle(newTitle: string) { 
    this.titleService.setTitle(newTitle); 
    } 
    ngOnInit(){ 

    /*http GET request */ 
    this.httpcustomservice.fetchdata(this.path) 
    .subscribe(
     (response) => { 
     this.navbardata = JSON.parse(JSON.stringify(response)); 
     this.dataloaded = true ; 
     }, 
     (error) => console.log("Server has been stopped"), 
    ) 
    } 

    hideNav(x){ 
    this.hiddenDiv =!x ; 
    } 
}

「這是我的問題的結束，請想辦法解決它「

來源

2017-08-16 mohit saroha