mgechev / angular-seed

🌱 [Deprecated] Extensible, reliable, modular, PWA ready starter project for Angular (2 and beyond) with statically typed build and AoT compilation
https://mgechev.github.io/angular-seed
MIT License
4.57k stars 1.45k forks source link

external node_modules conflict with local typings, duplicate identifier errors #735

Closed magnattic closed 8 years ago

magnattic commented 8 years ago

I am not sure if this is the fault of the external node module or something in seed, or just me using it wrong, but I keep running into duplicate identifier issues when trying to use libraries. Right now I cannot get angular2-highcharts to work with seed.

Steps to reproduce and a minimal demo of the problem

  1. Clone the current angular2-seed.
  2. Add to package.json under dependencies: "angular2-highcharts": "^0.0.6"
  3. Add simple.chart.ts under src/home/components/:

    import { Component } from 'angular2/core';
       import { CHART_DIRECTIVES } from 'angular2-highcharts';
    
       @Component({
           selector: 'simple-chart-example',
           directives: [CHART_DIRECTIVES],
           template: `
               <chart [options]="options"></chart>
           `
       })
       export class SimpleChartExample {
           constructor() {
               this.options = {
                   title : { text : 'simple chart' },
                   series: [{
                       data: [29.9, 71.5, 106.4, 129.2],
                   }]
               };
           }
           options: Object;
       }
  4. Run npm install and npm start.

Current behavior

During build.dev.js I get about 80 errors about jasmine and es6-shim typings looking like this:

C:/Projekte/angular2-seed2/node_modules/angular2-highcharts/typings/browser/ambient/es6-shim/index.d.ts(8,14): error TS2300: Duplicate identifier 'PropertyKey'.
C:/Projekte/angular2-seed2/node_modules/angular2-highcharts/typings/browser/ambient/es6-shim/index.d.ts(11,5): error TS2300: Duplicate identifier 'done'.
[...]
C:/Projekte/angular2-seed2/typings/browser/ambient/es6-shim/index.d.ts(8,14): error TS2300: Duplicate identifier 'PropertyKey'.
C:/Projekte/angular2-seed2/typings/browser/ambient/es6-shim/index.d.ts(11,5): error TS2300: Duplicate identifier 'done'.
[...]

The site starts, but the component will not work because it is not being properly compiled.

Expected/desired behavior

No errors and a working application. (obviously)

mgechev commented 8 years ago

Here are instructions how to solve the Duplicate identifier error http://blog.mgechev.com/2016/03/28/ambient-type-definitions-duplicate-identifier-typescript-fix/.

magnattic commented 8 years ago

Thanks for the link. Unfortunately I don't see how that fixes my problem, as the tsconfig in seed (which I use) is already excluding node_modules. But for some reason the definitions of /node_modules/angular2-highcharts/typings still show up as duplicate identifiers. I googled that topic a lot before asking here, is it possible that angular2-highcharts screws this up by adding <reference ..> in its dist files and the exclude is ignored because of the import of those files through import { CHART_DIRECTIVES } from 'angular2-highcharts' ?

I could obviously add an exclude for the es6-shim and jasmine typings in my own typings folder (or just not generate them in the first place), but then wouldn't the problem occur when the next node_module uses one of those typings?