重复标识符错误 - 使用 Angular 2 和 Typescript 2 的 Webpack 2 配置

Question

我正在尝试使用 webpack 2 和 typescript 2 配置我的 angular 2，但我遇到了 Duplicate Identifier 错误。我已经搜索了多种解决方案，但到目前为止都没有任何帮助。

错误：

    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'

我尝试将环境依赖项添加到我的 typings.json 文件但没有成功，并且还尝试完全删除 globalDependencies 并只留下环境依赖项：

{
  "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"
  }
}

我尝试在 tsconfig.json 文件中排除整个 typings 目录，但这会导致其他错误，例如：

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

我当前的 tsconfig.json 如下：

{
  "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
  }
}

我还尝试将以下内容添加到 tsconfig.json 的排除数组中：

"browser"
"browser.d.ts"

最后，我的 webpack.config.js 如下：

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 版本：2.0.0-rc.6
• 打字稿版本：2.0.2
• Webpack 版本：2.1.0-beta.20

如果有人对此有任何见解，我将不胜感激。

谢谢！

---

只是更新显示Dave V 提供答案后的更改：

以下文件夹已从类型目录中删除：

globals/es6-promise
globals/es6-shim
browser

typings 根目录中的 index.d.ts 删除了以下引用：

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

另外，我在 tsconfig.json 排除数组中添加了"typings/browser.d.ts"，因为它引用了browser/ambient 中的es6-shim：

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

Answer 1

您不能使用es6-promise 和core-js，因为它们都涵盖了Promise 概念并且有自己的定义。你只需要选择一个（如果你使用 Angular，他们推荐core-js）。