Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

"There are multiple modules with names that only differ in casing" #926

Closed
dyh333 opened this issue Aug 30, 2016 · 49 comments

Comments

@dyh333
Copy link

commented Aug 30, 2016

i cloned one project to local and npm install, npm start. but found below warning.
my dev environment is in windows 10 system

WARNING in (webpack)/buildin/module.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:

  • E:\GitHub\angular2-webpack-starter\node_modules\webpack\buildin\module.js
    Used by 2 module(s), i. e.
    E:\GitHub\angular2-webpack-starter\node_modules\punycode\punycode.js
  • e:\GitHub\angular2-webpack-starter\node_modules\webpack\buildin\module.js
    Used by 1 module(s), i. e.
    e:\GitHub\angular2-webpack-starter\node_modules\rxjs\util\root.js
@inska

This comment has been minimized.

Copy link

commented Sep 1, 2016

Same here

@junyun0516

This comment has been minimized.

Copy link

commented Sep 5, 2016

me too ㅠㅠ

@Junik

This comment has been minimized.

Copy link

commented Sep 7, 2016

If u use VS Code try change path to project from
c:[path to angular2-webpack-starter]
to
C:[path to angular2-webpack-starter]

in @dyh333 case fix:
e:\GitHub\angular2-webpack-starter> cd E:\GitHub\angular2-webpack-starter
npm start
in your terminal or cli

@PatrickJS

This comment has been minimized.

Copy link
Owner

commented Sep 9, 2016

/\ this is an OS (windows) problem. Please see the solution above via @Junik

Tipe CMS

@alvipeo

This comment has been minimized.

Copy link

commented Sep 9, 2016

@gdi2290 well, there are lots of us...

@PatrickJS

This comment has been minimized.

Copy link
Owner

commented Sep 9, 2016

this is a problem with node.js and windows so I can't do anything about it. you just need to make sure you cd with the correct path

@aminebizid

This comment has been minimized.

Copy link

commented Sep 9, 2016

On Windows, stop naming files with upper case. Here we use kebab case

@luchillo17

This comment has been minimized.

Copy link

commented Sep 13, 2016

I'm having almost the same warning except it's in Mac:

WARNING in ./~/rxjs/add/operator/map.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:
* /Users/aplicaciones2/Documents/Luchillo-tech-showcase/node_modules/string-replace-loader/index.js?{"search":"var sourceMappingUrl = extractSourceMappingUrl\\(cssText\\);","replace":"var sourceMappingUrl = \"\";","flags":"g"}!/Users/aplicaciones2/Documents/Luchillo-tech-showcase/node_modules/Rxjs/add/operator/map.js
    Used by 1 module(s), i. e.
    /Users/aplicaciones2/Documents/Luchillo-tech-showcase/node_modules/string-replace-loader/index.js?{"search":"var sourceMappingUrl = extractSourceMappingUrl\\(cssText\\);","replace":"var sourceMappingUrl = \"\";","flags":"g"}!/Users/aplicaciones2/Documents/Luchillo-tech-showcase/node_modules/Rxjs/Rx.js
* /Users/aplicaciones2/Documents/Luchillo-tech-showcase/node_modules/string-replace-loader/index.js?{"search":"var sourceMappingUrl = extractSourceMappingUrl\\(cssText\\);","replace":"var sourceMappingUrl = \"\";","flags":"g"}!/Users/aplicaciones2/Documents/Luchillo-tech-showcase/node_modules/rxjs/add/operator/map.js
    Used by 1 module(s), i. e.
    /Users/aplicaciones2/Documents/Luchillo-tech-showcase/node_modules/@angularclass/hmr-loader/index.js?pretty=true&prod=false!/Users/aplicaciones2/Documents/Luchillo-tech-showcase/node_modules/awesome-typescript-loader/dist/entry.js!/Users/aplicaciones2/Documents/Luchillo-tech-showcase/node_modules/angular2-template-loader/index.js!/Users/aplicaciones2/Documents/Luchillo-tech-showcase/node_modules/string-replace-loader/index.js?{"search":"(System|SystemJS)(.*[\\n\\r]\\s*\\.|\\.)import\\((.+)\\)","replace":"$1.import($3).then(mod => (mod.__esModule && mod.default) ? mod.default : mod)","flags":"g"}!/Users/aplicaciones2/Documents/Luchillo-tech-showcase/src/vendor.browser.ts

That one error is repeated aprox 52 times with different rxjs operators.

So as this happens to me in Mac OSX 'El Capitan', i don't think my issue is with the cd used, any ideas?

Update: After some digging it happens whenever i import the Rxjs Observable, it seems the string-replace-loader used in the preLoader config in the webpack.common.js file is responsible for that issue.

@luchillo17

This comment has been minimized.

Copy link

commented Sep 13, 2016

Ok found my issue, i'm importing like:

import { Observable } from 'Rxjs/Observable';
import { Subscription } from 'Rxjs/Subscription';
import 'Rxjs/add/operator/debounceTime';
import 'Rxjs/add/observable/fromEvent';

When it should be like:

import { Observable } from 'rxjs/Observable';
import { Subscription } from 'rxjs/Subscription';
import 'rxjs/add/operator/debounceTime';
import 'rxjs/add/observable/fromEvent';

Note the upper case R in rxjs.

Tipe CMS

@buddyackerman

This comment has been minimized.

Copy link

commented Oct 31, 2016

@Junik this fix didn't work for me as my path was already set with an upper case drive letter. Is the casing in the path critical as well? I have mixed case in the folders of the path to my project directory.

e.g. C:\Projects\Angular2\Blah\MyProject

@MarkPieszak

This comment has been minimized.

Copy link

commented Nov 18, 2016

@buddyackerman I just ran into this on one of my machines and realized I was using Node 6.4, I upgraded to 7.1 and the issues went away, could of been the way I was doing the directory as well, but I believe this has been fixed on the Node end (see nodejs/node#6624)

@karocksjoelee

This comment has been minimized.

Copy link

commented Jan 12, 2017

I've encountered this issue today , I solve by checking the import components url . In my case is XXX.module.ts & XXX.routing.ts . the url after you import { Anyting } must all in lower case .

Enviroment: MacOS , node 6.9.1

@Vishal-vash

This comment has been minimized.

Copy link

commented Feb 3, 2017

In my code I resolved this issue by updating:

import { Component, OnInit } from '@angular/Core'
to
import { Component, OnInit } from '@angular/core'

@Babazon

This comment has been minimized.

Copy link

commented Feb 23, 2017

This is usually a result of a miniscule typo. If you are importing your modules like import angular from 'angular', import React from 'react' => Go through your files and check where you used < from 'React'> or <from 'Angular'> The error descriptions should have been written more clearly, but what I explained has been the cause of my problem each time I for this error on webpack commands.

@protoEvangelion

This comment has been minimized.

Copy link

commented Feb 28, 2017

@Babazon For me I had capitalized Radium like this: import Radium from 'Radium' when I should have imported it like this: import Radium from 'radium'

The error went away.

@mengdu

This comment has been minimized.

Copy link

commented Apr 14, 2017

这个应该是命令行的问题,我也遇到的,我今天改了cmder的启动路径
cmd /k "%ConEmuDir%\..\init.bat" -new_console:d:e:\
然后也出现了类似的问题

* E:\lanyue\vue\admin-customer\node_modules\.2.2.1@webpack\buildin\global.js
    Used by 1 module(s), i. e.
    E:\lanyue\vue\admin-customer\node_modules\.2.2.1@vue\dist\vue.esm.js
* e:\lanyue\vue\admin-customer\node_modules\.2.2.1@webpack\buildin\global.js
    Used by 2 module(s), i. e.
    e:\lanyue\vue\admin-customer\node_modules\echarts\lib\echarts.js

原来是这个盘符写成小写了,于是我改成大写就好了

cmd /k "%ConEmuDir%\..\init.bat" -new_console:d:E:\

@birjitningomba

This comment has been minimized.

Copy link

commented Apr 25, 2017

Looks like anything after @angular in import statements should be in lower case.
e.g. @angular/core, @angular/router

Sometimes if you type @angular/Core or @angular/Router you may get this error. So check all the places where you have import @angular for incorrect case.

To be more specific you may want to check all your import statements and check if it maps to whatever inside the node_modules folder.

Please refer above comments "luchillo17 commented on Sep 13, 2016"

@namdeom

This comment has been minimized.

Copy link

commented May 18, 2017

I could resolve the issue after making all folder name small.Earlier I was using camel case and it was failing.

qingxo pushed a commit to qingxo/smartRaise that referenced this issue May 19, 2017
@zjh65204

This comment has been minimized.

Copy link

commented Jun 26, 2017

原来不是我一个人遇到这个问题!

@fygethub

This comment has been minimized.

Copy link

commented Jul 9, 2017

我也遇到了 发现就是一个import 路径的一个字母大小写写错了。

i got the issue like :

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:
* /Users/fydor/Desktop/work/CongZhi/wex-front/node_modules/babel-loader/lib/index.js??ref--0-0!/Users/fydor/Desktop/work/CongZhi/wex-front/app/component/Course/CourseList.jsx
    Used by 1 module(s), i. e.
    /Users/fydor/Desktop/work/CongZhi/wex-front/node_modules/babel-loader/lib/index.js??ref--0-0!/Users/fydor/Desktop/work/CongZhi/wex-front/app/component/Course/CourseMore.jsx
* /Users/fydor/Desktop/work/CongZhi/wex-front/node_modules/babel-loader/lib/index.js??ref--0-0!/Users/fydor/Desktop/work/CongZhi/wex-front/app/component/course/CourseList.jsx
    Used by 3 module(s), i. e.
    /Users/fydor/Desktop/work/CongZhi/wex-front/node_modules/babel-loader/lib/index.js??ref--0-0!/Users/fydor/Desktop/work/CongZhi/wex-front/app/component/home/Home.jsx

found my issue, i'm importing like:

//CourseList
import CourseMore from './component/Course/CourseMore.jsx';

the right is like:

//CourseList
import CourseMore from './component/course/CourseMore.jsx';
due to the 'c'

1 similar comment
@fygethub

This comment has been minimized.

Copy link

commented Jul 9, 2017

我也遇到了 发现就是一个import 路径的一个字母大小写写错了。

i got the issue like :

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:
* /Users/fydor/Desktop/work/CongZhi/wex-front/node_modules/babel-loader/lib/index.js??ref--0-0!/Users/fydor/Desktop/work/CongZhi/wex-front/app/component/Course/CourseList.jsx
    Used by 1 module(s), i. e.
    /Users/fydor/Desktop/work/CongZhi/wex-front/node_modules/babel-loader/lib/index.js??ref--0-0!/Users/fydor/Desktop/work/CongZhi/wex-front/app/component/Course/CourseMore.jsx
* /Users/fydor/Desktop/work/CongZhi/wex-front/node_modules/babel-loader/lib/index.js??ref--0-0!/Users/fydor/Desktop/work/CongZhi/wex-front/app/component/course/CourseList.jsx
    Used by 3 module(s), i. e.
    /Users/fydor/Desktop/work/CongZhi/wex-front/node_modules/babel-loader/lib/index.js??ref--0-0!/Users/fydor/Desktop/work/CongZhi/wex-front/app/component/home/Home.jsx

found my issue, i'm importing like:

//CourseList
import CourseMore from './component/Course/CourseMore.jsx';

the right is like:

//CourseList
import CourseMore from './component/course/CourseMore.jsx';
due to the 'c'

@PleaseTryAgain

This comment has been minimized.

Copy link

commented Jul 14, 2017

the same problem to me!!
I use git bash to run a project. Then got this issue. then change to cmd run command line the success.
I found cmd root file is UPPER WORD like: 'F', otherwise git bash root file is lower word like 'f'.
so change git bash to cmd,then issue solved

@shmup

This comment has been minimized.

Copy link

commented Jul 14, 2017

I'll append that using cmd.exe over something like msys2's Git Bash is definitely a solution that will work for many Windows devs.

@SunilJamkatel

This comment has been minimized.

Copy link

commented Jul 24, 2017

I had this error when I required a module with the first letter as capital. For example, I was doing
var React = require('React');

while it should have been

var React = require('react');

@AuthurWang

This comment has been minimized.

Copy link

commented Jul 31, 2017

same problem to me !
maybe webpack path is case-insensitive, if we import from example.js or Example.js in different files, during compile, webpack will throw this warning.

@ewild

This comment has been minimized.

Copy link

commented Sep 12, 2017

I think I know why this happens. I created a component using the Angular CLI and then tried to created another component in the original folder. My ng lines looked like:

ng g c WorkersCompCode
ng g c workers-comp-code/LaborRole <<< Bad

I tried to add the new component to the filesystem folder. This jacked it up. When I redid the sub component like below it worked fine:

ng g c WorkersCompCode/LaborRole

Also, if you put a -d for dry run, you can see it will put the component in the path you wanted on the file system.

@haisumkundi

This comment has been minimized.

Copy link

commented Sep 14, 2017

Resolved it,
what i was doing:
import { ABC } from './guards/ABC'

what resolved the issue:
import { ABC } from './guards/abc'

the name of the file where i had defined ABC was 'abc' where as i was using 'ABC' in import.
Hope it helps

@Shenchuanhuan

This comment has been minimized.

Copy link

commented Sep 19, 2017

I also met this problem today.
I solved it by using @luchillo17 's method.
My system is macOS Sierra 10.12.6

@luchillo17

This comment has been minimized.

Copy link

commented Sep 19, 2017

@Shenchuanhuan Nice 😄.

@maccurt

This comment has been minimized.

Copy link

commented Oct 29, 2017

I solved it by using @luchillo17 's method.

@sanazBG

This comment has been minimized.

Copy link

commented Nov 15, 2017

Using react .. It doesn't matter how you type the drive letter .. Any folder in my server directory(including the server directory) should be typed with small letters .. that fixed the warning for me and got a "Compiled Successfully" absolutely every warning came from my "client" directory .. thats on Windows.

@benjamin21st

This comment has been minimized.

Copy link

commented Nov 29, 2017

This is not just a windows-issue, I had the same issue on Mac when I wrote:

import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs/Observable/of';

Notice that I used uppercase "O".

I fixed with

import { Observable } from 'rxjs/observable';
import { of } from 'rxjs/observable/of';

And it worked :)

@yussan

This comment has been minimized.

Copy link

commented Dec 18, 2017

i solved my warning the same as above by removing the file/folder name using capital to lowercase.

@jazzfog

This comment has been minimized.

Copy link

commented Jan 1, 2018

I had this issue on Windows and it was a funny one:

First I noticed that difference in case was in my path to my dev folder, not in app itself

d:\Web\JavaScriptApps\MyApp\node_modules\webpack\buildin\global.js
vs
d:\web\JavaScriptApps\MyApp\node_modules\webpack\buildin\global.js

Web folder is capital in first case, though real folder name is web.

Initially I thought that there is something wrong with Webpack or Node path resolver but later I noticed that path showing in the console window I was working in is actually d:\Web\...

Obviously it was wrong and as I opened new console with correct path - everything was fine with my app.

So I started to think how could it happen and I found that one of the shortcuts in my environment had wrong target path d:/Web/... because I copied it from my older desktop where web folder had actually capitalized name Web. So I got this wrong context and it confused the node app.

@dengshenkk

This comment has been minimized.

Copy link

commented Jan 24, 2018

I found this to be the result of a mix of windows and Mac development

@smoetje

This comment has been minimized.

Copy link

commented Mar 10, 2018

I have the same issue, it came just "out of the blue" without any reason. It worked fine until yesterday evening. Working on Windows 10 with latest node, npm & git bash. It was rather frustrating... Even tried to pull and start from my (original) master branch, it just persists.
I however got it back to work without these warnings when using the windows command, instead of git bash. Interesting enough in my case, I work on Windows (7 & 10) only (no mac over here)....

warning  in C:/Users/nicol/LaravelProjects/oostendezingt/node_modules/webpack/buildin/global.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:\Users\nicol\LaravelProjects\oostendezingt\node_modules\webpack\buildin\global.js
    Used by 2 module(s), i. e.
    C:\Users\nicol\LaravelProjects\oostendezingt\node_modules\punycode\punycode.js
* C:\Users\nicol\Laravelprojects\oostendezingt\node_modules\webpack\buildin\global.js
    Used by 2 module(s), i. e.
    C:\Users\nicol\Laravelprojects\oostendezingt\node_modules\vue\dist\vue.runtime.esm.js

 warning  in C:/Users/nicol/LaravelProjects/oostendezingt/node_modules/webpack/buildin/module.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:\Users\nicol\LaravelProjects\oostendezingt\node_modules\webpack\buildin\module.js
    Used by 1 module(s), i. e.
    C:\Users\nicol\LaravelProjects\oostendezingt\node_modules\punycode\punycode.js
* C:\Users\nicol\Laravelprojects\oostendezingt\node_modules\webpack\buildin\module.js
    Used by 1 module(s), i. e.
    C:\Users\nicol\Laravelprojects\oostendezingt\node_modules\lodash\lodash.js

 warning  in C:/Users/nicol/LaravelProjects/oostendezingt/node_modules/webpack/hot/emitter.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:\Users\nicol\LaravelProjects\oostendezingt\node_modules\webpack\hot\emitter.js
    Used by 1 module(s), i. e.
    C:\Users\nicol\LaravelProjects\oostendezingt\node_modules\webpack-dev-server\client\index.js?http://localhost:8080
* C:\Users\nicol\Laravelprojects\oostendezingt\node_modules\webpack\hot\emitter.js
    Used by 1 module(s), i. e.
    C:\Users\nicol\Laravelprojects\oostendezingt\node_modules\webpack\hot\dev-server.js

 warning  in C:/Users/nicol/LaravelProjects/oostendezingt/node_modules/webpack/hot/log.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:\Users\nicol\LaravelProjects\oostendezingt\node_modules\webpack\hot\log.js
    Used by 1 module(s), i. e.
    C:\Users\nicol\LaravelProjects\oostendezingt\node_modules\webpack\hot nonrecursive /^\.\/log$/
* C:\Users\nicol\Laravelprojects\oostendezingt\node_modules\webpack\hot\log.js
    Used by 2 module(s), i. e.
    C:\Users\nicol\Laravelprojects\oostendezingt\node_modules\webpack\hot\dev-server.js````

@BayuP

This comment has been minimized.

Copy link

commented Mar 20, 2018

i have same problem here when i create new react app this is always appear even when i open my old project i already use lowercase and i didnt know how to fix it

@YvonneD

This comment has been minimized.

Copy link

commented Mar 22, 2018

I think the reason is when you cd to the project file ,the name have Capital issue,such as you want to cd to your desktop,you should check the folder name in your computer,lower case or upper case.
My computer is "Desktop",so I should type "cd ~/Desktop/projectname". Then it should be all done.

@HiIcy

This comment has been minimized.

Copy link

commented Mar 29, 2018

I have same problem here,but I am in Vue O(∩_∩)O. @mengdu 感谢,我也是用的cmder 发现竟然是盘符问题呜呜,给跪了

@wenxiayili

This comment has been minimized.

Copy link

commented Apr 11, 2018

@namdeom it resolve my problem too...

@George35mk

This comment has been minimized.

Copy link

commented Jun 4, 2018

I solved by moving the files that have the problem into another directory

  • then I checked for uppercase if I found some files with uppercase I renamed this files to lower case
  • and then i paste the files back again.
@zhuy2018

This comment has been minimized.

Copy link

commented Jul 5, 2018

我也遇到这个问题了
warning in F:/Web/vue-cli/vue-examplel/node_modules/webpack/buildin/global.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:

  • F:\Web\vue-cli\vue-examplel\node_modules\webpack\buildin\global.js
    Used by 2 module(s), i. e.
    F:\Web\vue-cli\vue-examplel\node_modules_sockjs-client@1.1.4@sockjs-client\dist\sockjs.js
  • f:\Web\vue-cli\vue-examplel\node_modules\webpack\buildin\global.js
    Used by 1 module(s), i. e.
    f:\Web\vue-cli\vue-examplel\node_modules\vue\dist\vue.esm.js

应该怎么解决的??

@zhuy2018

This comment has been minimized.

Copy link

commented Jul 5, 2018

我解决了,原来不是盘符原因,只要把文件删除了,然后重新导入就OK。
这坑踩的深,后面人跳过此坑!!!!!!!

@PietroLaGrotta

This comment has been minimized.

Copy link

commented Sep 7, 2018

Simply if you capitalize a file name that is already imported in ather files of you project, node js explodes. It become creazy. I returned the file name to lowercase and node js is returned to run happily :-)

@davidqqq

This comment has been minimized.

Copy link

commented Nov 12, 2018

我解决了,原来不是盘符原因,只要把文件删除了,然后重新导入就OK。
这坑踩的深,后面人跳过此坑!!!!!!!

This tip actually helped me and would like to translate in English to help people who might need it.

Here it goes:

I solved it. It wasn't caused by drive letter. Remove the problematic file and reimport it. It should be OK now.

@Tech007Harsh

This comment has been minimized.

Copy link

commented Feb 4, 2019

WARNING in ./node_modules/@Angular/common/fesm5/http.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:

  • F:\CodeLoverTechnology\Development\Web_Development\NirmanIASWeb\NirmanIASPortal\node_modules@Angular\common\fesm5\http.js
    Used by 16 module(s), i. e.
    F:\CodeLoverTechnology\Development\Web_Development\NirmanIASWeb\NirmanIASPortal\node_modules@ngtools\webpack\src\index.js!F:\CodeLoverTechnology\Development\Web_Development\NirmanIASWeb\NirmanIASPortal\src\app\app.module.ts* F:\CodeLoverTechnology\Development\Web_Development\NirmanIASWeb\NirmanIASPortal\node_modules@angular\common\fesm5\http.js
    Used by 4 module(s), i. e.
    F:\CodeLoverTechnology\Development\Web_Development\NirmanIASWeb\NirmanIASPortal\node_modules@ngtools\webpack\src\index.js!F:\CodeLoverTechnology\Development\Web_Development\NirmanIASWeb\NirmanIASPortal\src\app\Services\SubCategoryService\sub-category-master.service.ts
@Tech007Harsh

This comment has been minimized.

Copy link

commented Feb 4, 2019

i am also encountering this problem.. i have services to post and get, two of them are working fine but others are not and showing 400 bad request ... but nothing is wrong in the code..i think i am encountering unexpected behavior while compiling,i am posting other service and the source is showing other html and hence giving 400 bad request.

@Isaquedias

This comment has been minimized.

Copy link

commented May 5, 2019

No meu caso eu tinha uma pasta
/Pages
troquei por
/pages

coloquei em minusculo

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
You can’t perform that action at this time.