Экспорт компонента по умолчанию в Reactjs

Оператор export используется при создании модулей JavaScript для экспорта активных привязок к функциям, объектам или примитивным значениям из модуля, чтобы их можно было использовать в других программах с оператором import. Экспортированные привязки по-прежнему можно изменять локально; при импорте, хотя они могут быть прочитаны только модулем импорта, значение обновляется всякий раз, когда оно обновляется модулем экспорта.

давайте узнаем это на примере

в React, когда вы создаете компонент примерно так:

import React from 'react';
const Hello = () => {
    return (
        <h1>Hello, World!</h1>
)}

затем, когда вы попытаетесь использовать этот компонент в другом месте вашего приложения React, вы получите следующую ошибку:

Ошибка при попытке импорта: «./Hello.js» не содержит экспорт по умолчанию (импортируется как «Hello»).

и это говорит о том, что вы импортируете компоненты в свой файл App.js, а не экспортируете этот компонент по умолчанию.

для устранения этой ошибки вы должны в конце вашего компонента экспортировать его по умолчанию, чтобы он выглядел примерно так:

import React from 'react';
const Hello = () => {
return (
<h1>Hello, World!</h1>
)}
export default Hello

выполнив этот шаг и экспортировав свой компонент по умолчанию, вы получите это сообщение.

Скомпилировано успешно!

перед окончанием этой статьи я оставляю для вас несколько полезных ресурсов:

developer.mozilla.org › экспорт

developer.mozilla.org › импортировать

Импорт компонента (Создать реагирующее приложение)

удачи:)