'App / hero.ts' dosyası konsolda bir modül hatası değil, nerede dosyaları açısal2 ile dizin yapısında saklamak için?


144

angular2Bu adreste öğreticiyi yapıyorum : https://angular.io/docs/ts/latest/tutorial/toh-pt3.htmlhero Arabirimi appklasörün altında tek bir dosyaya koydum , konsolda bu hata var :

app/app.component.ts(2,20): error TS2306: File 'app/hero.ts' is not a module.
[0] app/hero-detail.component.ts(2,20): error TS2306: File 'app/hero.ts' is not a module.

Arayüz dosyamı bir kahraman klasörüne koyarsam hata kaybolursa, bu dokümantasyonda belirtilmez, içe aktarma işlemimde sorun nedir?

Benim ithalat direktifim (bileşen dosyalarının başlangıcında) app.components.tsve hero-detail.component.ts:

import {Component} from 'angular2/core';

import {Hero} from './hero';

İçe aktarma yönergemi şu şekilde değiştirmeli miyim : import {Hero} from './'; veya kodu bir kahraman klasörüne koymalı mıyım?

Yanıtlar:


422

Kodu yazdığınız düzenleyiciyi (VS kodu veya Yüce) yeniden başlatmayı deneyin. Derleyin ve tekrar çalıştırın. Ben de aynısını yaptım ve işe yaradı.

Bu, düzenleyicinizden yeni bir sınıf eklediğinizde veya açısal kırpma hizmetinizi çalıştırmaya devam ettiğinizde olur. Aslında düzenleyiciniz veya 'ng sun' komutu yeni oluşturulan dosyaları bulamayabilir.


4
Yeniden başlatma işe yarıyor ... ama herkes temel sebebin ne olduğunu biliyor?
Gaddigesh

Açısal 4 ve VS Kodu ile de bu problemle karşılaştım. Code School'daki verileri bir mocks.ts dosyasına ayırdıkları bir videoyu izliyordum ve her derlendiğinde bir modül olmadığını söyledi. VS Kodunu yeniden başlatmak işe yaradı. Bunun olması çok garip, ama diğer parçaları ayrı dosyalara taşırken herhangi bir hata almadım.
Eric Garrison

2
Söylemek üzücü ama işleri yeniden başlatmak. Ve bu benim hayatımı sefil hale getirir: bir şey işe yaramazsa, bunun bir hata yaptığımdan mı yoksa sadece Visual Code'u yeniden başlattığımda çalışmasına izin verecek bazı açıklanamayan Düğüm / Açısal / Görsel Kod mu diye bilmiyorum. veya sunucu. Profesyoneller böyle çalışmaz! :-(
Alexis Dufrenoy

2
Dosyamı kaydederek düzelttim. #sad
Malcolm Anderson

1
Hem sunucuyu hem de editörü yeniden başlatmayı denedim, yardımcı olmadı. Sınıfları ve dosyaları yeniden adlandırmayı denedim, sonunda çalıştı. Garip ama gerçek.
yürütülebilir

37

Arayüz için ihracat anahtar kelimesini unuttum çünkü aynı öğretici aynı hatayı aldım .


32

muhtemelen sınıf tanımına "Dışa Aktar" eklemeyi unutmuşsunuzdur.

->

export class Hero {
     id: number;
     name: string;
   }

Ayrıca şunu deneyin:

export {Hero} 

hero.ts sınıfınızın en altına gidin ve son olarak büyük harfli dosya adını ve sınıf adını kontrol edin.


1
İhracat yapmayı unutmadım. Ben belki bir yazım hatası olduğunu düşündüm bu yüzden kopyalayıp kodunu yapıştırdı. Bu sorunu düzeltti. Ama sonra önceki koduma geri döndüm ve o da işe yaradı. Bir şey yanlış.
Mariusz.W

bu normal bir şey yaratmaktan daha constmı iyi ?
Dani

29

Bunun nedeni, dosyaları oluşturduktan sonra kaydetmemenizdir.

Editör'deki "Tümünü Kaydet" i tıklayarak tüm dosyayı kaydetmeyi deneyin.

Mavi renk kullanılarak gösterilen "Dosya" menüsünün altına bakarak kaydedilmeyen dosya sayısını görebilirsiniz.




3

Projeme yeni bir dosya eklediğimde yaşadığım gibi, ng sunucusunu durdurup yeniden başlatmam gerekiyor.


2

Öğretici, tüm bileşenleri ve arabirim dosyasını aynı dizine './hero'koymanızı sağlar, bu nedenle başka bir yere taşımak isterseniz , göreli içe aktarma bunu değiştirmeniz gerekir.

Düzenle: Kod yine de çalışabilir, ancak derleyici yanlış bir konumdan alma girişiminde bulunduğunuz için şikayet edecek. İçe aktarmayı yapınıza göre değiştiririm. Örneğin:

app/
  component1/
    component1.ts
  compnent2/
    component2.ts
  hero.ts

Ben sadece ithalat değiştirmek istiyorum import {Hero} from '../hero'.


Kodum mükemmel yazıyorum neyse olsa çalışma, bir import {Hero} from './';veya import {Hero} from './hero';. Arayüz dosyalarını depolamanın en iyi yolu nedir acaba?
Sunitrams

Üzgünüm @Zyzle, OP'nin sahip olduğu sorunu çözmediğini düşünmüyorum
Steve Dunn

2

Bu hata, ng serve yeni eklenen bir dosyayı otomatik olarak . Bunu düzeltmek için sunucunuzu yeniden başlatmanız yeterlidir.

Metin düzenleyiciyi veya IDE'yi yeniden açmayı kapatmak bu sorunu çözse de, birçok insan projeyi yeniden açmanın tüm stresinden geçmek istemiyor. Metin düzenleyiciyi kapatmadan bunu düzeltmek için ...

Sunucunun çalıştığı terminalde,

  • ctrl+CSunucuyu durdurmak için düğmesine basın ,
  • Sunucuyu yeniden başlatın: ng serve

Bu işe yaramalı.


1

Aynı sorunla karşılaştım.

Sunucumu yeniden başlattım ve iyi çalışıyor. Bir böcek gibi görünüyor.


1

sunumu yeniden başlat

Aynı sorunu yaşadım. Hatayı aramak için hatayı seçtim ve yanlışlıkla bir CTRL + C (kopyalamak için anlam) yaptım, bu da hizmet sonlandırıldı. Sunumu yeniden başlattığınızda hata kayboldu :). Bazen yazım hataları ve şişman parmaklar yardımcı olur ;-)


1

Editör sorunu. Açısal CLI kullanmayan yeni dosyalar oluşturduğunuzda, Düzenleyicinin yeni değişikliklerinizden haberdar olması için Dosya> Tümünü Kaydet (VS Kodu) bölümüne gittiğinizden emin olun. Sonra tekrar "ng serve --open" komutunu çalıştırın. Benimkini çözdü. Umarım yardımcı olur


0

VSC'de de aynı sorunla karşılaştım. Düzenleyiciyi yeniden başlattı ve uygulamayı yeniden başlattı. İyi çalıştı.


Bu, herhangi bir içgörü sağlayacak bir cevap değildir. Yeniden başlatmanın bu sorunun cevabı olduğunu düşünseniz bile, bunun neden olduğunu söylemelisiniz.
M--

0

Ben sadece iyi bir derleme alabilir önce Visual Studio Code ama düğüm sunucusu işlemi de yeniden başlatmak zorunda olduğunu bulundu.


0

Aynı sorunla karşı karşıya kaldım, sunucumu yeniden başlatmayı, editörü yeniden açmayı denedim ama bilgisayar yeniden başlatmayı büyü yaptı.

Not: Windows makinesinde sorunla karşı karşıya kaldım ve modülü yeni bir klasöre taşıdığımda sorun oluştu.


0

Benzer bir sorunum vardı. Yazdığım kahraman yerine Hero

aşağıdakileri içe aktarın:

import { Hero } from '../Hero';

0

Bazen bu hata .ts dosyası kaydedilmediğinde oluşur. Bu nedenle, projedeki tüm dosyaların kaydedildiğinden emin olun, aksi takdirde editörü yeniden başlatmayı deneyin.


0

Komut istemini açın, uygulama klasörüne gidin, ör. D:\angular-tour-of-heroes\src\app

Ardından aşağıdaki komutu kullanarak yeni bir dosya oluşturun:

ng generate class hero

Bu bir hero.tsdosya oluşturur . Sonra dışa aktarma kodunu yapıştırabilirsiniz ve hata gitti.


0

Tüm dosyaları kaydetmelisiniz. Örneğin, html, css, component.ts, modül, model dosyaları. Her dosyayı açın ve ctrl-S tuşlarına basın. Bu benim için çalıştı


0

Benim durumumda 'app / hero.ts' dosyasındaki değişiklikleri kaydetmeyi unutmuştum, kaydettikten ve hizmeti yeniden başlattıktan sonra sorun çözüldü.


0

Kararım,

Benim durumumda bir model dosyası oluşturdum ve boş bıraktım,

başka bir modele aktardığımda bana hata veriyor. bu yüzden bir model typescript dosyası oluştururken tanımı yazın.


0

değişiklik

import{observable} from 'rxjs/observable'; 

için

import{observable} from 'rxjs';

derlemeden önce .TS dosyasını kaydettiğinizden emin olun.


0

sınıfı dışa aktarmadan önce bunu ekle

@Injectable({
  providedIn: 'root'
})  
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.