Heads up! Can't have 2 files with the same name in a package...?

Hello everyone,

I have taken a whole day debugging this, I lost about half my hair too. Consider this following folder structure:

package_folder
|--- package.js
|--- client.js
|--- client
|    |--- lib
|    |    |--- editor.js
|    |--- views
|         |--- editor.js
|         |--- editor.html

This package is a wrapper for an in-house wysiwyg editor. lib/editor exports the editor object from which we create the editor instance.

I also have editor.js and editor.html in my views folder which will be the template that will be used by the package’s users. We want both to expose the template and the lib’s editor, so in client.js which is my api.mainModule I wrote this

import {Waggle_Editor} from './client/lib/editor.js'
import './client/views/editory.js'

export {Waggle_Editor};

So far so good huh? Well I thought so too! But on the application, the template was not declared and created a template not found error. I tried added/removing stuff in onRendered or onCreated but nothing did it. I tried adding the html file to client.js and then I could see my html, but no javascript was ran on it, just as if views/editor.js never got imported…

So I got sick of it and continued my way onto another package I needed to create, it had a very similar setup and everything was working fine! So I copy/paste most contents to make sure it was identical, then pointed to the files I wanted to and still no joy.

It turns out that renaming the file corrected this behavior… So by just renaming editor.js to editor1.js and fixing the related imports, everything worked.

So my question is this: Is this a normal behaviour? Have I overlooked something in the docs, or in my files (which are slightly bigger than the example) I have not tried to reproduce on an empty package but I’m pretty confident that it would do the same.

With that structure all files will be eagerly loaded and will therefore follow the “Meteor Classic” loading order strategy.

In order for import to work you need to make sure those files are not eagerly loaded - so somewhere under an imports/ directory.

1 Like

Thanks Rob, I do remember that this was in effect. I thought that for packages using the modules package this was not a problem anymore.

Furthermore, now that I think of it, if all files were to be eagerly loaded, the template would be defined and use-able wouldn’t it?

Well, I don’t think having files with the same name is a problem. All (JavaScript) files are wrapped in a self executing closure, so there should be no issue there. However, it looked like you were being affected by load order - hence my answer.

However, I did miss the package-folder :confounded:. Load order for packages is managed within the package.js.

Exactly what I thought. You are pointing out that there should be no issue at all. But taking my example, just renaming my file made it work…

I was, and still am, not expecting such behavior, I cannot make up any reason for why this would be, but it seems to be :confused:

Was editory.js (extra y at the end) just a copy/paste error in your code sample?

I’m sorry, that’s a mistake on my part, I copied the working code
(editor.js was renamed editors.js). We should read editor.js