2016-04-07 2 views
1

Я создал очень простой компонент ReactJs.Компонент Reactjs во внешнем js fille не загружается когда-то

Я создал html-файл. Код ниже

<!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> 

код файла JS ниже

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

Проблема в том, что, когда я пытаюсь запустить то же самое. Он не показывает компонент React, который я пытаюсь сделать. Однако тот же кусок кода, если я внедряю его в html-файл, отлично работает. Эта проблема не с примерами, которые поставляются с библиотеками React, но только с htmls, которые я создал. Это ясно указывает на отсутствие проблемы с загрузкой.

Я новичок в реактиве и поэтому хотел бы подтвердить, что может быть проблемой здесь.

+0

Ваш код (второй фрагмент) представлен в ReactBasic.js? Вы видите ошибку в консоли? – Mayas

+0

Можете ли вы предоставить больше «ReactBasic.js»? – erichardson30

+0

Да, код находится в файле ReactBasic.js, и это все, что имеет ReactBasic.js. В консоли нет ошибок. Я проверил его как первое, когда он не работал. –

ответ

1

Поскольку вы не используете npm, это происходит из-за пути для вашего JS-файла. Он не может найти ваш JS-файл, поэтому он не загружается в DOM.

Чтобы решить эту проблему у вас есть два варианта:

  1. Поместите ваши JS и HTML-файл в том же каталоге и обновляют путь в HTML-файле
  2. Используйте абсолютные пути к файлу JS, расположенный в отдельном каталог.
Смежные вопросы