Как импортировать компонент в react-crate-app?

Question

[Aleksey100]

Привет всем.

Создал приложение через react-create-app.

В index.js пытаюсь подключить компонент который лежит в папке pages

import PageActiveUsers from '../pages/PageActiveUsers';

Получаю ошибку

Module not found: You attempted to import ../pages/PageActiveUsers which falls outside of the project src/ directory. Relative imports outside of src/ are not supported. You can either move it inside src/, or add a symlink to it from project's node_modules/.

Пути для импорта разные пробовал, работает только если положить PageActiveUsers.js напрямую в src и импортировать как
import PageActiveUsers from './PageActiveUsers';

Подскажите как решить? А то неудобно все файлы в src хранить.

Answer 1

[Егор Живагин]

Так потому что компоненты должны лежать внутри папки src, а там уже можно любую структуру создавать.
Например src/pages/... или src/components/pages/...

Ошибка говорит "Вы пытаетесь импортировать модуль, который лежит за пределами исходников (папка src) проекта. Импорт таких модулей не поддерживается. Вы можете перенести его внутрь папки или подключать его как модуль node".

Comments

[Aleksey100]

Папка pages лежит внутри src. И все равно такая ошибка

[Егор Живагин]

Странно как-то. Пути поменяли?
Можно попробовать перезапустить проект...
У меня с такой структурой и импортами туда-сюда всё работает

[Aleksey100]

У меня в index.js путь вот такой

import PageActiveUsers from '../pages/PageActiveUsers';

Он же такой должен быть?
Структура у меня такая же, ну только у меня папка 'pages' Называется, а не 'components'.

А у вас проект тоже через react-create-app создан?

[Егор Живагин]

Aleksey100, да, через create-react-app

Уберите первую точку в пути)

[Aleksey100]

Егор Живагин,
Убрал, все равно ошибка, правда уже другая

./src/pages/PageActiveUsers.js
Module not found: Can't resolve './ActiveUser' in 'C:\Users\User05\Desktop\Alexey\chatix_interface\src\pages'

[Егор Живагин]

Aleksey100, ну, модуль PageActiveUsers нашёлся )
А где у вас в коде есть строчка './ActiveUser' ?

[Aleksey100]

Егор Живагин,
Спасибо! Разобрался )

У меня в PageActiveUsers подключается еще компонент ./ActiveUser, а он лежал в папке src, и соответственно путь к нему должен был быть в двумя точками. Поменял путь до него и все заработало )

[Егор Живагин]

Aleksey100, та не за что )

Answer 2

[Stalker_RED]

Прочтите текст сообщения.

Comments

[Aleksey100]

Я прочел, вариант положить компонент в src не подходит, а на счет

"add a symlink to it from project's node_modules"

я к сожалению не смог разобраться.

[Stalker_RED]

Aleksey100, https://ru.wikipedia.org/wiki/%D0%A1%D0%B8%D0%BC%D...