CODEWITHSUNDEEP
javascriptmeteor
Haikal Nashuha
Haikal Nashuha

Reputation: 3048

Restructuring Meteor App

I am restructuring my meteor application when suddenly every view (html template) that has its logic (the JS script) separated from the initial file stop working.

initially my project looked like this 

-project
   -.meteor
   -client
      -templateA.html
      -templateB.html
      -templateC.html
      -client.js <-- contain JS for all template
      -display.css 
   -server
      -server.js
   -model.js <--collections
   -router.js <-- iron-router router

But as the project grows, it became hard for me to manage whole js code in a single file. So I decided to separate it into smaller modules. so it became like this

 -project
    -.meteor
    -client
       -views
          -templateA.html
          -tempplateA.js 
          -templateB.html
          -templateB.js
          -templateC.html
          -client.js <---templateC JS is still in client.js
       -stylesheets
          -display.css

    -server
       -server.js
    -model.js
    -router.js

Every view (template) does not work. The browser only generate blank page. However, I managed to generate templateC. So my deduction is, templateC works since the JS is still in the original file.

What should I do to make it work to the rest of the templates?

Upvotes: 1

Views: 66

Answers (1)

Hubert OG
Hubert OG

Reputation: 19544

The /client/compatibility was a key to your problem.

Variables you define in a JS file are local to that file. See this section.

 

 

Basically, Meteor wraps each separate file with (function(){ ... })(); pattern. This means that when you define:

var something = {};

in one file, then something is undefined in another. If you want to create a variable that will be shared in the whole app, you need to make it a global variable. Fortunately, that's simple – just remove the var keyword:

something = {};

Now you can use something anywhere in your code.

Upvotes: 1

Related Questions