Utilisation de @types dans WebStorm - angular, typescript, webstorm

Je suis le Webpack intro pour Angular 2. J'utilise WebStorm mais quand je lance npm start, un alias pour webpack-dev-server, Je reçois plus de 60 erreurs TypeScript transpile de la forme suivante

ERROR in [at-loader] node_modules@angularcommonsrcdirectivesng_class.d.ts:48:34
TS2304: Cannot find name "Set".

ERROR in [at-loader] node_modules@angularcommonsrcpipesasync_pipe.d.ts:44:38
TS2304: Cannot find name "Promise".

Je me souviens avoir eu des problèmes similaires lors de l’utilisation de dactylographes ///<reference path="../typings/index.d.ts"/> au sommet d'un ts déposer à la racine de mon application.

Cependant, cet exemple de webpack utilise le nouveau @types mais je n'arrive pas à obtenir de bons résultats avec WebStorm. J'ai essayé de mettre à jour tsconfig.json avec le typeRoots attribuer comme suggéré ici, mais en vain. Vous pouvez trouver la source de cette démo webpack ici.

Des idées comment faire fonctionner cela dans WebStorm?

Réponses:

@ james-b

Changer votre règle TS dans webpack.common.js à chargeurs: ["awesome-typescript-loader", "angular2-template-loader"] comme ci-dessous:

Votre code webpack.common.js:

module: {
rules: [
{
test: /.ts$/,
loaders: [{
loader: "awesome-typescript-loader",
options: { configFileName: helpers.root("tsconfig.json") }
} , "angular2-template-loader"]
},
{
test: /.html$/,
loader: "html-loader"
},
{
test: /.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/,
loader: "file-loader?name=assets/[name].[hash].[ext]"
},
{
test: /.css$/,
exclude: helpers.root("src", "app"),
loader: ExtractTextPlugin.extract({ fallbackLoader: "style-loader", loader: "css-loader?sourceMap" })
},
{
test: /.css$/,
include: helpers.root("src", "app"),
loader: "raw-loader"
}
]
},

Code webpack.common.js mis à jour:

module: {
rules: [
{
test: /.ts$/,
loaders: ["awesome-typescript-loader", "angular2-template-loader"]
},
{
test: /.html$/,
loader: "html-loader"
},
{
test: /.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/,
loader: "file-loader?name=assets/[name].[hash].[ext]"
},
{
test: /.css$/,
exclude: helpers.root("src", "app"),
loader: ExtractTextPlugin.extract({ fallbackLoader: "style-loader", loader: "css-loader?sourceMap" })
},
{
test: /.css$/,
include: helpers.root("src", "app"),
loader: "raw-loader"
}
]
},