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"
]