Casing on imports

I spent quite a bit of time last night trying to solve the following error:

TypeError: Error loading "can@2.3.24#Map/Map" at file:C:/development.research/donejs/my-app/node_modules/can/Map/Map.js
Error loading "can@2.3.24#Map/Map" from "my-app@0.0.0#index.stache!done-autorender@0.8.0#autorender" at file:C:/development.research/donejs/my-app/src/index.stache
Cannot read property 'List' of undefined
   at Function.can.Map.can.Construct.extend.setup (file:C:/development.research/donejs/my-app/node_modules/can/Map/Map.js:89:21)
   at Function.can.extend.extend [as extend] (file:C:/development.research/donejs/my-app/node_modules/can/construct/construct.js:598:30)
   at file:C:/development.research/donejs/my-app/node_modules/can/Map/Map.js:24:36
   at stealInstantiateResult.execute (C:\development.research\donejs\my-app\node_modules\steal\main.js:1270:32)
   at linkDynamicModule (C:\development.research\donejs\my-app\node_modules\steal-systemjs\dist\system.src.js:668:32)
   at link (C:\development.research\donejs\my-app\node_modules\steal-systemjs\dist\system.src.js:528:11)
   at Object.execute (C:\development.research\donejs\my-app\node_modules\steal-systemjs\dist\system.src.js:847:11)
   at doDynamicExecute (C:\development.research\donejs\my-app\node_modules\steal-es6-module-loader\dist\es6-module-loader.src.js:1950:25)
   at link (C:\development.research\donejs\my-app\node_modules\steal-es6-module-loader\dist\es6-module-loader.src.js:1998:24)
   at doLink (C:\development.research\donejs\my-app\node_modules\steal-es6-module-loader\dist\es6-module-loader.src.js:1772:7)

It turned out that my import statement had the incorrect casing:

import Map from "can/Map/";

It should’ve been:

import Map from "can/map/";

Is there perhaps any way that this can be made more apparent? Given enough experience I guess one would come to learn about these but as a newcomer it caught me quite easily.

From the file paths, it looks like you are developing directly on the file system. Can you try if you get the same error when running from a webserver (e.g. donejs develop or any other HTTP server)? Generally all imports are usually lowercase (and I’d recommend keeping it the same way with filenames in your app since it can cause weird errors on different file systems otherwise).

I am actually hosting using donejs start since I’m using the development.html file. It works fine when using the lowercase import and I guess it is ok given that the convention is to use lowercase file names.

I don’t quite get why it fails but for anyone running into this it may be worthwhile either throwing an error or logging a warning when the file name casing doesn’t match.

Not a big deal but it tripped me up for a while. :slight_smile: