2

I am trying to configure my angular 2 with webpack 2 and typescript 2, and I'm running into Duplicate Identifier errors. I've searched for multiple solutions and none have helped so far.

errors:

    typings\globals\core-js\index.d.ts 
    `Duplicate identifier 'PropertyKey'
    typings\globals\core-js\index.d.ts 
   `Duplicate identifier 'Promise'
    typings\globals\es6-promise\index.d.ts 
    `Duplicate identifier 'Promise'
     typings\globals\es6-shim\index.d.ts 
    `Duplicate identifier 'PropertyKey'

I've tried adding the ambient dependency to my typings.json file with no success, and also tried to remove the globalDependencies completely and just leaving the ambientDependencies:

{
  "globalDependencies": {
    "core-js": "registry:dt/core-js#0.0.0+20160725163759",
    "es6-shim": "github:DefinitelyTyped/DefinitelyTyped/es6-shim/es6-shim.d.ts#7de6c3dd94feaeb21f20054b9f30d5dabc5efabd",
    "es6-collections": "registry:dt/es6-collections#0.5.1+20160316155526",
    "es6-promise": "registry:dt/es6-promise#0.0.0+20160614011821",
    "jasmine": "registry:dt/jasmine#2.2.0+20160621224255",
    "node": "registry:dt/node#6.0.0+20160909174046"
  },
  "ambientDependencies": {
    "es6-shim": "registry:dt/es6-shim#0.31.2+20160215162030"
  }
}

I've tried excluding the whole typings directory in the tsconfig.json file, but that lead to other errors such as these:

node_modules\@angular\platform-browser\src\facade\collection.d.ts:8:8
Cannot find name 'Map'.

My current tsconfig.json is below:

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": false,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false,
    "suppressImplicitAnyIndexErrors": true
  },
  "exclude":[
    "node_modules",
    "typings/main",
    "typings/main.d.ts"
  ],
  "awesomeTypescriptLoaderOptions":{
    "useWebpackText":true
  }
}

I also tried adding the following to the exclude array of the tsconfig.json:

"browser"
"browser.d.ts"

And lastly, my webpack.config.js is below:

var webpack = require('webpack');
var HtmlWebPackPlugin = require('html-webpack-plugin');
var path = require('path');
var ExtractTextPlugin = require('extract-text-webpack-plugin');

module.exports = {
  context: path.resolve('app'),
  entry: {
    'app':'./main.ts'
  },
  output:{
    path: path.resolve('dist'),
    publicPath:'/',
    filename: 'bundle.js'
  },

  resolve:{
    extensions:['', '.js', '.ts']
  },

  devtool:'module-inline-source-map',

  watch:true,

  devServer: {
    historyApiFallback: true,
    stats: 'minimal'
  },
  module:{
    loaders: [
      {
        test:/\.ts$/,
        exclude:/node_modules/,
        loaders: ['awesome-typescript-loader', 'angular2-template-loader']
      },
      {
        test: /\.html$/,
        loader: "html"
      },
      {
        test: /\.css$/,
        exclude: path.resolve('app'),
        loader: ExtractTextPlugin.extract({fallbackLoader: 'style-loader', loader: 'css-loader'})
      },
      {
        test: /\.css$/,
        include: path.resolve('app'),
        loader: 'raw'
      },
      {
        test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)?(\?v=[0-9]\.[0-9]\.[0-9])?$/,
        loader: 'file?name=fonts/[name].[hash].[ext]?'
      },
      {
        test: /\.eot(\?v=\d+\.\d+\.\d+)?$/,
        loader:'file'
      },
      {
        test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/,
        loader:'url?limit=10000&mimetype=application/octet-stream'
      },
      {
        test: /\.svg(\?v=\d+\.\d+\.\d+)?$/,
        loader:'url?limit=10000&mimetype=image/svg+xml'
      }
    ]
  },
  plugins: [
    new ExtractTextPlugin("styles.css"),

    new HtmlWebPackPlugin({
      template: path.resolve('app/index.html')
    }),

    new webpack.ProvidePlugin({
      $: "jquery",
      jquery:"jquery",
      jQuery:"jquery",
      "windows.jQuery":"jquery",
      "window.Tether":'tether'
    })
  ]
}
  • Angular 2 version:2.0.0-rc.6
  • Typescript version: 2.0.2
  • Webpack version: 2.1.0-beta.20

If anyone has any insight on this, I'd appreciate your help.

Thanks!


Just an update to show the changes after Dave V provided the answer:

The follwing folders were deleted from the typings directory:

globals/es6-promise
globals/es6-shim
browser

index.d.ts in the typings root had the following references removed:

/// <reference path="globals/es6-promise/index.d.ts" />
/// <reference path="globals/es6-shim/index.d.ts" />

Also, I added "typings/browser.d.ts" to the tsconfig.json exclude array, since it was referencing the es6-shim inside browser/ambient:

"exclude":[
    "node_modules",
    "typings/main",
    "typings/main.d.ts",
    "typings/browser.d.ts"
  ]

1 Answer 1

1

You can't use es6-promise and core-js since they both cover the Promise concept and have their own definitions for it. You need to pick just one (if you are using Angular, they recommend core-js).

Sign up to request clarification or add additional context in comments.

5 Comments

Alright, but where would I go about excluding one of those, since tsconfig.json doesn't seem to respect the following and still has issues: "exclude":[ "typings/globals/es6-promise", "typings/globals/es6-shim", "typings/browser/ambient/es6-shim" "node_modules", "typings/main", "typings/main.d.ts" ]
you need to remove it from the typings.json file so it doesn't install and remove it from the index.d.ts (or main.d.ts if that's what it is called) main typings reference file (if you have it)
Thanks! that fixed the errors I was seeing, I'll edit my post to show what I did based on your solution, so if anybody runs into the same issue they can see the changes.
I have a similar problem, also trying to run Webpack with Angular2. But i get the error duplicate identifier on 'PropertyKey' from "node_modules/core-js/index.d.ts" and from "node_modules/typescript/lib/lib.es6.d.ts". How can I resolve this issue????
This is an issue with the latest version of the core-js typings, reported here: github.com/DefinitelyTyped/DefinitelyTyped/issues/15140 . Use the version 0.3.96 to get around it for now

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.