../client/js/** unaccessible from mvc files (route files)

[nikse]

hey there, I'm starting to play around with miso and am attempting to set up a semi complex file structure that allows me to create components/modules and load them into any of my mvc files for easy reuse and code separation. my current set up looks like this, piggy backing off the current miso compilation strategy that puts everything into the miso.js file

• client
  • js
    • components
      • header
        • controller
        • view
        • index (mostly just ties controller and view into single object and for loading by convention)
      • articles_grid
        • controller
        • view
        • index
• mvc
  • home
  • layout
• server
• etc... (standard miso struct)

now, loading in the header through the layout file is working fine

header = require('../client/js/components/header/index')

BUT when i am trying to load the articles grid into my home mvc file I am getting an in browser console error

Uncaught Error: Cannot find module '../client/js/components/articles_grid/index'

any clue as to what is going wrong here? should i break this stuff out of the client/js folder and create my own gulp tasks to browserify/compile etc..? the fact that it works with the layout and not with a regular mvc file is throwing me off a bit

[jsguy]

Good question - without seeing the code, my guess would be that miso isn't compiling it correctly - have a look in the console where miso is running for any errors, and also try this:

• Save the "home" file
• Stop and start miso

If that doesn't work, post up the contents of your app somewhere and I'll have a look.

[jsguy]

Also, the intention for reusable components are for them to be included as an NPM module, the server/client directories are really only intended for app specific code, for example, this is a reusable validation model binder that we use:

https://github.com/jsguy/validator.modelbinder

It isn't a component like yours, but the idea is the same.

One good way to develop reusable components on an app level would be to create a /modules directory in your app's directory, and require the components in your home file - miso should automatically pick these up.

Let me know if that works for you, and I'll make that the "official" way to create reusable app-specific components.

[nikse]

I see what you're saying about updating the folder structure to remove things from the client folder.
I made that update, but am unfortunately still getting the error client side. I'm going to play around with it for a bit and see if I can get something working, otherwise I'll get a repo up for you to check out. I'll keep ya updated, thanks!

[jsguy]

Sounds good - I'm going to add some more documentation so that it's more obvious where things go and what they do, and I might also re-factor some directories a little - I'm thinking /system really should be something like .miso (with the dot), so it is obvious you shouldn't touch it, and the generated miso.js file really shouldn't be in the client folder, as the idea is that the users files go there...

[nikse]

I wasn't able to get that file loaded. Here is a repo with a small example of the problem I am having. You should be able to see the problem if you run the app (note on port 8000) and check out the javascript console

https://github.com/nikse/miso_test

[jsguy]

Ok found the problem - when using image_grid = new require(..., browserify won't be able to work with it, as it is a dynamic object, so it leaves the reference as-is. Change it to image_grid = require(... and the error goes away.

Let me know how you go.

[jsguy]

I've updated the documentation to explain why this happened in your code here:

https://github.com/jsguy/misojs/wiki/How-miso-works#requiring-files

I'm going to close this now, if you're still having issues, feel free to reopen it.

[nikse]

yup, that worked. thanks a lot

[nikse]

on a side note i'm going to be using this project extensively for a project i'm working on. i am really liking it so far, but i'd like to understand a bit more of the magic that is happening and i'd also like to know what your future plans for the framework are. and of course i'd like to help contribute if at all possible! shoot me an email if/when you have time, it'd be great to get some dialogue going

my email is kam@fullst.ac

[jsguy]

As far as the magic goes, I'm in the middle of a documentation phase - I'm starting with a "getting started" guide, then doing some work on how the database adaptors and the general architecture works.

Future plans are to grow the framework into something that people want to use - and it will always be open source licensed, so people can use it as they see fit.

I'll send you a mail, so we can discuss your app.