2016-04-07 23 views
1

Çok basit bir ReactJs bileşeni oluşturdum.Harici bir js dosyasındaki Reactjs bileşeni, bazen yüklenmiyor

Bir html dosyası oluşturdum. Kod js dosyası kod sorunu

ReactDOM.render(
    <h1>This content is from a React Component!</h1>, 
    document.getElementById('example') 
); 

altına ı çalıştığınızda aynı çalıştırmak için olduğu

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="I`enter code here`SO-8859-1"> 

    <title>Basics of React</title> 

</head> 
<body> 
    <div id="example"></div> 


    <script src="../build/react.js"></script> 
    <script src="../build/react-dom.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.24/browser.min.js"></script> 
    <script type="text/babel" src="../js/ReactBasic.js"></script> 

</body> 
</html> 

altındadır. Oluşturmaya çalıştığım React Bileşeni göstermiyor. Ancak bir html dosyasına gömdüğümde aynı kod parçası iyi çalışıyor. Bu sorun, React kitaplıklarıyla gelen örneklerle değil, yalnızca oluşturduğum htmls ile. Bu açıkça yükleme sorunu olmadığını gösterir.

Tepkimeye yeni geldim ve bu nedenle burada sorunun ne olabileceğini doğrulamak istedim.

+0

Kodunuz (ikinci snippet) ReactBasic.js içinde sağlanıyor mu? Konsolda herhangi bir hata görüyor musunuz? – Mayas

+0

'ReactBasic.js' daha fazlasını sağlayabilir misiniz? – erichardson30

+0

Evet, kod, ReactBasic.js içinde ve bu, ReactBasic.js'nin sahip olduğu değerdir. Konsolda hata yok. Çalışmazken ilk şey olarak kontrol ettim. –

cevap

1

npm kullanmıyorsunuz, bu, JS dosyanızın yolu nedeniyle gerçekleşiyor. JS dosyanızı bulamıyor, bu nedenle DOM'a yüklenmiyor.

  1. ayrı bulunan JS dosyasına
  2. kullanın mutlak yolları aynı dizinde sizin JS ve HTML dosyasını koyun ve HTML dosyasındaki yolunu güncelleme:

    iki seçeneğiniz var Bu sorunu çözmek için dizin.