title: how import qrcode-generator into angular 2 app?
body: <p>I'm trying to use <a href="https://github.com/kazuhikoarase/qrcode-generator" rel="nofollow">qrcode-generator</a> in my app but no success with my settings even though it's working in <a href="http://plnkr.co/edit/zEzqUfrnjehG84wm16De?p=preview" rel="nofollow">plunker</a>, in my app I'm using angular-cli and angular 2.rc-1.<br>
  Steps to reproduce:  </p>
  
  <pre><code>ng new newAppName
  cd newAppName
  ng serve
  </code></pre>
  
  <p>it works, then.  </p>
  
  <pre><code>npm i qrcode-generator // (note this is missing the svg support).
  ng serve // still work
  </code></pre>
  
  <p>then change the configurations in 2 files.
  angular-cli-build.js:</p>
  
  <pre><code>var Angular2App = require('angular-cli/lib/broccoli/angular2-app');
  module.exports = function(defaults) {
    return new Angular2App(defaults, {
      vendorNpmFiles: [
        'systemjs/dist/system-polyfills.js',
        'systemjs/dist/system.src.js',
        'zone.js/dist/**/*.+(js|js.map)',
        'es6-shim/es6-shim.js',
        'reflect-metadata/**/*.+(js|js.map)',
        'rxjs/**/*.+(js|js.map)',
        'qrcode-generator/**/*.+(js|js.map)',
        '@angular/**/*.+(js|js.map)'
      ]
    });
  };
  </code></pre>
  
  <p>and system-config.ts:</p>
  
  <pre><code>/**********************************************************************************
   * User Configuration.
   *********************************************************************************/
  /** Map relative paths to URLs. */
  const map: any = {
    'qrcode-generator': 'vendor/qrcode-generator'
  };
  const packages: any = {
    'vendor/qrcode-generator': {
      main: 'qrcode',
      defaultExtension: 'js'
    }
  };
  // ... the rest is the same
  </code></pre>
  
  <p>edit <code>new-app-name.component.ts</code> and import the qrcode-geenerator in it like this</p>
  
  <pre><code>// vscode underline the qrcode-generator string and complai about not finding it
  import * as qrcode from 'qrcode-generator'; 
  </code></pre>
  
  <p>then <code>ng serve</code> which is still running errors out with this message:</p>
  
  <blockquote>
    <p>/path/to/project/newAppName/tmp/broccoli_type_script_compiler-input_base_path-jscpZEq5.tmp/0/src/app/new-app-name.component.ts
    (3, 25): Cannot find module 'qrcode-generator'.</p>
  </blockquote>
  
  <p>I tried installing the typings for it by adding this to the typings.json file:</p>
  
  <pre><code>"globalDependencies": {
      "qrcode-generator": "registry:dt/qrcode-generator#0.0.0+20160412152159"
    }
  </code></pre>
  
  <p>then running:</p>
  
  <pre><code>typings i
  </code></pre>
  
  <p>install successful, but still the same error.
  angular-cli version:</p>
  
  <pre><code>angular-cli: 1.0.0-beta.5
  node: 6.2.0
  os: linux x64
  </code></pre>
  
  <p>Am I missing something?<br>
  Is there other configuration I'm missing?</p>