title: TypeScript inheritance and circular dependencies in SystemJS
body: <p>I'm using TypeScript with <code>--module system</code> (SystemJS) in a very large project.  SystemJS supports cyclic dependencies, and most of the time it works fine.  However, when TypeScript inheritance gets involved, things begin to break.  </p>
  
  <p>For example, if a <code>class A</code> depends on <code>class B</code>, and <code>class B</code> <strong>inherits</strong> from <code>class A</code>, then if <code>class A</code> gets loaded first:</p>
  
  <ol>
  <li>It will pause <code>class A's</code> resolution and will try to load the <code>class B</code> dependency</li>
  <li><code>class B</code> will think its dependencies are resolved, since <code>class A</code> has been touched.</li>
  <li><code>class B's</code> inheritance will fail to resolve, because <code>class A</code> is still undefined.</li>
  </ol>
  
  <p>Most of the "solutions" I can find on the web to circular dependencies with module loaders are either:</p>
  
  <ul>
  <li>Change your design / combine classes into a single module</li>
  <li>CommonJS and non-TypeScript specific workarounds</li>
  </ul>
  
  <p>I feel like there are valid justifications for circular designs, and combining classes into giant files is not always desirable, so please consider these workarounds to be off topic for the question that I am asking.  </p>
  
  <p>Are there any solutions to the actual problem?  </p>