na compilação: ng serve --open
ERROR in ./src/app/photo/photo.component.js Module parse failed: Unexpected character '@' (3:0) You may need an appropriate loader to handle this file type. | import { Component } from "@angular/core"; | | @Component({ | selector: 'ap-photo',
| templateUrl: 'photo.component.html' |
|---|
1)photo.component.js 1.1) obs: para mim não aparece "autocomplete" 1.2) deu erro na linha "export class PhotoComponent {" em "PhotoComponent " configurei : VSCode -> Preferences -> Settings Searsh settings:javascript.implicitProjectConfig.experimentalDecorators marcar check
1.3) Código:
import { Component } from "@angular/core";
@Component({ selector: 'ap-photo', templateUrl: 'photo.component.html' }) export class PhotoComponent { description = 'Leão';
url = 'https://upload.wikimedia.org/wikipedia/commons/thumb/5/5a/Sultan_the_Barbary_Lion.jpg/440px-Sultan_the_Barbary_Lion.jpg';}
2)photo.component.html
2.1)Código:
<img class="img-thumbnail" [src]="url" [alt]="description">
3) app.module.ts 3.1) na linha import { PhotoComponent } from './photo/photo.component';
não é aceito o link com a pasta do componente. dá os eguinte erro:
Could not find a declaration file for module './photo/photo.component'. 'c:/dados/Leo/CURSO_ALURA/projetos/alurapic/src/app/photo/photo.component.js' implicitly has an 'any' type.ts(7016)
tentei resolver executando:
npm install --save @types/react-router
3.2) Código:
import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core';
import { AppComponent } from './app.component'; import { PhotoComponent } from './photo/photo.component';
@NgModule({ declarations: [ AppComponent, PhotoComponent ], imports: [ BrowserModule ], providers: [], bootstrap: [AppComponent] })
export class AppModule { }
4.1) app.component.html código: 5) observação: os arquivos do componente novo estão criados na pasta "photo" dentro de "app"
o que devo fazer?