Symbols in parent module are not available in an exported submodule

Question

I have a something like the following structure

export module Foo {
   export var DEBUG = false;
}

module Foo.Utils {
   export function fooFunc() : void { if(Foo.DEBUG) doIt() }
}

This works fine. I can do Foo.Utils.fooFunc() without problems.

The thing is that WebStorm highlights references to Foo.Utils and says "the private member is not accessible". I then tried exporting the module to avoid this error, but now the typescript compiler borks and gives me

The property 'DEBUG' does not exist on value of type 'typeof Foo'. 
Warning: Task "typescript:all" failed. Use --force to continue.

Why does this happen, and how can I achieve my intended goal of referencing Foo.DEBUG in the submodule while keeping the module non-private?

Answer 1

If you want to export a module from a file but want it split into multiple segements you can do the following :

module Foo {
   export var DEBUG = false;
}

module Foo.Utils {
   export function fooFunc() : void { if(Foo.DEBUG) doIt() }
}

export = Foo;

That said. You don't need to use internal modules if you are using external modules. Here's the difference : https://www.youtube.com/watch?v=KDrWLMUY0R0&hd=1