Как исправить: There are multiple modules with names that only differ in casing?
При компиляции получаю предупреждение:
WARNING in ./src/Interface/User/SignIn/Index.js
There are multiple modules with names that only differ in casing.
This can lead to unexpected behavior when compiling on a filesystem with other case-semantic.
Use equal casing. Compare these module identifiers:
* c:\frontend\node_modules\babel-loader\lib\index.js!c:\frontend\node_modules\eslint-loader\index.js!c:\frontend\src\User\SignIn\Index.js
Used by 29 module(s), i. e.
c:\frontend\node_modules\babel-loader\lib\index.js!c:\frontend\node_modules\eslint-loader\index.js!c:\frontend\src\Header\Index.js
* c:\frontend\node_modules\babel-loader\lib\index.js!c:\frontend\node_modules\eslint-loader\index.js!c:\frontend\src\User\SignIn\index.js
Used by 2 module(s), i. e.
c:\frontend\node_modules\babel-loader\lib\index.js!c:\frontend\node_modules\eslint-loader\index.js!c:\frontend\src\Forms\CreateProject\Index.js
@ ./src/Interface/User/SignIn/Index.js
@ ./src/Interface/Header/Index.js
@ ./src/Pages/App/Index.js
@ ./src/index.js
Я так понял - это из-за того, что одни файлы index, другие Index. Как исправить эту ошибку не переименовывая файлы?
daima, ваш вопрос читал. В ответе одновременно описано самое рациональное решение вашей проблемы и рекомендация, как писать код так, чтобы подобных ошибок у вас больше не возникало.
Предупреждение показывается в следствии того, что у вас перепутан регистр в импортах.
Импортируете модуль по индексу './src/User/SignIn', а там индекс в верхнем регистре.
Пути написаны правильно
Нет.
WARNING in ./src/Interface/User/SignIn/Index.js
There are multiple modules with names that only differ in casing.
This can lead to unexpected behavior when compiling on a filesystem with other case-semantic.
Use equal casing. Compare these module identifiers:
* c:\frontend\node_modules\babel-loader\lib\index.js!c:\frontend\node_modules\eslint-loader\index.js!c:\frontend\src\User\SignIn\Index.js
Used by 29 module(s), i. e.
c:\frontend\node_modules\babel-loader\lib\index.js!c:\frontend\node_modules\eslint-loader\index.js!c:\frontend\src\Header\Index.js
* c:\frontend\node_modules\babel-loader\lib\index.js!c:\frontend\node_modules\eslint-loader\index.js!c:\frontend\src\User\SignIn\index.js
Used by 2 module(s), i. e.
c:\frontend\node_modules\babel-loader\lib\index.js!c:\frontend\node_modules\eslint-loader\index.js!c:\frontend\src\Forms\CreateProject\Index.js
@ ./src/Interface/User/SignIn/Index.js
@ ./src/Interface/Header/Index.js
@ ./src/Pages/App/Index.js
@ ./src/index.js
SignIn\index.js - где webpack нашел такую запись х.з. Тотал ничего такого не нашел, да и если ошибиться с регистром - линтер начнет вопить, что невозможно импортировать и т.д.
Антон Спирин, Антуан, ты гений! Но, даже если и не гений, то пивас ты точно заработал!!!
Действительно, в одном месте было ./src/User/SignIn
Зы: "Не надо называть индексные файлы в верхнем регистре." - файлы с компонентами в реакте пишутся с большой буквы. Index.js - самый главный. В нем вся логика
Sergiu Mitu, можно проще: export { default as SignIn } from './SignIn';
Обычно делают такие индексы для папок с компонентами.
export { default as Button } from './Button';
export { default as Radio } from './Radio';
export { default as Select } from './Select';
export { default as Divider } from './Divider';
/* ... */
Очень удобно потом импортировать:
import {
Button,
Radio,
Select,
Divider,
} from 'components/core';
Простой
Простой
