Question

几天来我一直在尝试解决此错误，而且我不知道该怎么办。我是Angular的新手，我还不知道事情如何运作。我被卡住了，我不知道如何解决它。我已经安装和卸载了几次最新版本的模块。

错误：

Date: 2018-07-12T15:50:51.658Z - Hash: e52bb885c7cfcb67e69c - Time: 11159ms
3 unchanged chunks
chunk {main} main.js, main.js.map (main) 5.74 kB [initial] [rendered]
chunk {vendor} vendor.js, vendor.js.map (vendor) 3.14 MB [initial] [rendered]

WARNING in ./src/main.ts
8:41-50 "export 'AppModule' was not found in './app/app.module'
i ｢wdm｣: Compiled with warnings.
i ｢wdm｣: Compiling...
 10% building modules 0/2 modules 2 active … lazy groupOptions: {} namespace objectERROR in src/app/app.module.ts(23,3): error TS1146:     Declaration expected.

Date: 2018-07-12T15:53:03.615Z - Hash: 8944712e4124fea4b527 - Time: 802ms
4 unchanged chunks
chunk {styles} styles.js, styles.js.map (styles) 74.6 kB [initial] [rendered]

WARNING in ./src/main.ts
8:41-50 "export 'AppModule' was not found in './app/app.module'
i ｢wdm｣: Compiled with warnings.
i ｢wdm｣: Compiling...

Date: 2018-07-12T15:57:27.693Z - Hash: 8944712e4124fea4b527 - Time: 421ms
5 unchanged chunks

WARNING in ./src/main.ts
8:41-50 "export 'AppModule' was not found in './app/app.module'
i ｢wdm｣: Compiled with warnings.
ERROR in src/app/app.module.ts(23,3): error TS1146: Declaration expected.

我的index.html：

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> 
  <title>ConFusion</title>
  <base href="/">

  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
  <app-root></app-root>
</body>
</html>

App.module.ts

import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { MatToolbarModule } from '@angular/material/toolbar'; 
import { FlexLayoutModule } from '@angular/flex-layout';


import 'hammerjs';

@NgModule({

  imports: [ 


    BrowserAnimationsModule,
    MatToolbarModule,
    FlexLayoutModule

  ],

})

App.component.ts

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

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent {
  title = 'app';
}

App.component.html

<!--The content below is only a placeholder and can be replaced.-->
<mat-toolbar color="primary"> <span>Ristorante Con Fusion</span> </mat-toolbar>

Styles.scss

/* You can add global styles to this file, and also import other style files */
@import '~@angular/material/prebuilt-themes/deeppurple-amber.css';

// some basic resets 

body { 
  padding: 0; 
  margin: 0; 
  font-family: Roboto, sans-serif; 

}

Answer 1

您需要模块的导出语句：

export class AppModule {}

Answer 2

您缺少添加此行。然后只有错误发生了。

export class AppModule {}

您尚未在app.module.ts文件中添加此行。另外，您还可以在main.ts文件中尝试在Boostrapping中使用此AppModule。然后仅显示错误。添加此行后，错误将得到解决。

希望您能理解自己所做的错误。有关更多参考，请访问angular.io官方网站以开始学习角

Answer 3

我已解决问题！如果有人遇到相同的问题，我将保留以下步骤：

我删除了所有内容，然后重新全局安装了Angular-cli：

npm install -g @angular/cli@latest

创建的混淆项目：

ng new conFusion --style=scss

在我安装的conFusion项目中：

npm install @angular/material@latest --save
npm install @angular/cdk@latest --save
npm install --save @angular/animations@latest
npm install --save hammerjs@latest

在index.html的“开头”中，我添加了：

<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

然后：

npm install --save @angular/flex-layout@latest

在app.module.ts中：

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppComponent } from './app.component';

import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { MatToolbarModule } from '@angular/material/toolbar'; 
import { FlexLayoutModule } from '@angular/flex-layout';


import 'hammerjs';

@NgModule({
  declarations: [
    AppComponent
  ],
   imports: [
    BrowserModule,
    BrowserAnimationsModule,
    MatToolbarModule,
    FlexLayoutModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

在app.component.html中，我替换为：

<mat-toolbar color="primary"> <span>Ristorante Con Fusion</span> </mat-toolbar>

在styles.scss中：

@import '~@angular/material/prebuilt-themes/deeppurple-amber.css';

// some basic resets 

body { 
 padding: 0; 
 margin: 0; 
 font-family: Roboto, sans-serif; 

}

应用程序运行完美！

src / app / app.module.ts（23,3）中的错误：错误TS1146：需要声明

3 个答案: