title: Error in using Karma with SystemJS, gulp, and TypeScript
body: <p>I am new to <code>node.js</code> stack like <code>npm</code>, <code>gulp</code> etc. I had wrote some JavaScript unit test cases earlier, and now want to use <code>Karma</code> as test runner. However, after a few attempts I am completely lost now.</p>
  
  <p>To start, I have following project configurations:</p>
  
  <ul>
  <li><code>SystemJS</code> as module loader.</li>
  <li><p>Folder structre (some are omitted for brevity):</p>
  
  <pre><code>project
  |
  |--build //contains all gulp tasks
  |
  |--dist //contains the output (*.html, *.js etc.)
  |
  |--jspm_packages 
  |
  |--node_modules
  |
  |--src //contains the source .html, and *.ts
  |
  |--tests //contains unit tests in *.ts. I also have a gulp task to build tests/**/*.ts to *.js in the same folder.
  |
  |--typings //contains type definitions
  |
  |--config.js //contains SystemJS configuration
  |
  |--karma.conf.js
  </code></pre></li>
  <li><p><code>karma.conf.js</code></p>
  
  <pre><code>// Karma configuration        
  
  module.exports = function (config) {
      config.set({
          basePath: '',
          frameworks: [ 'qunit'],
          files: [
              'jspm_packages/system.js',
              //'config.js',
              'dist/custom/*.js' //,
              //'tests/**/*.js'
          ],
          exclude: [        ],
          preprocessors: {        },
          reporters: ['progress'],
          port: 9876,
          colors: true,
          logLevel: config.LOG_INFO,
          autoWatch: true,
          browsers: ['Chrome'],
          singleRun: false,
          concurrency: Infinity
      });
  }
  </code></pre></li>
  </ul>
  
  <p>However, whenever I do <code>karma start</code>, I have error <code>Uncaught TypeError: Unexpected anonymous System.register call.</code>.  Is there anyway to resolve this?</p>
  
  <p><strong>Other Attempts:</strong></p>
  
  <ol>
  <li>Tried to create a gulp task, according to <a href="https://github.com/karma-runner/gulp-karma" rel="noreferrer">https://github.com/karma-runner/gulp-karma</a>. But have same problem.</li>
  <li><p>Tried to use <a href="https://www.npmjs.com/package/karma-systemjs" rel="noreferrer"><code>karma-systemjs</code></a>. And the <code>karma.conf.js</code> was different as follows:</p>
  
  <pre><code>// Karma configuration        
  
  module.exports = function (config) {
      config.set({
          ...
          frameworks: [ 'systemjs', 'qunit'],
          plugins: ['karma-systemjs', 'karma-chrome-launcher', 'karma-firefox-launcher'],
          systemjs: {
              configFile: 'config.js',
              serveFiles: ['jspm_packages/**/*.js'],
              config: {
                  transpiler: 'babel'
              }
          },
          ...
      });
  }
  </code></pre>
  
  <p>And in this case I got following error, though I have both <code>SystemJs</code> and <code>Babel</code> installed:</p>
  
  <pre><code>[WARNING] Looking up paths with require.resolve() is deprecated.
  Please add "systemjs" to your SystemJS config paths.
  Cannot find "systemjs".
    Did you forget to install it ?
    npm install systemjs --save-dev
  [WARNING] Looking up paths with require.resolve() is deprecated.
  Please add "babel" to your SystemJS config paths.
  Cannot find "babel-core".
    Did you forget to install it ?
    npm install babel-core --save-dev
  </code></pre></li>
  </ol>
  
  <p>Any help in this regard will be great.</p>