Angular 在WebStorm中使用@types

我在看《角度2》。我正在使用WebStorm，但当我运行

npm start

（一个

webpack dev server

的别名）时，我收到了60多个以下形式的TypeScript传输错误

ERROR in [at-loader] node_modules\@angular\common\src\directives\ng_class.d.ts:48:34
    TS2304: Cannot find name 'Set'.

ERROR in [at-loader] node_modules\@angular\common\src\pipes\async_pipe.d.ts:44:38
    TS2304: Cannot find name 'Promise'.

我记得在使用打字时也遇到过类似的问题，并通过在我的应用程序根目录下的

ts

文件顶部添加

//

解决了这个问题

然而，这个webpack示例使用了新的

@types

，但我似乎无法让它与WebStorm配合使用。我尝试过按照建议使用

typeroot

属性更新

tsconfig.json

，但没有效果。您可以找到此网页包演示的源代码

你知道如何在WebStorm中使用它吗？

@james-b

将webpack.common.js中的TS规则更改为加载器：[“awesome-typescript-loader”，“angular2模板加载器”]，如下所示：

您的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'
        }
    ]
},

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'
        }
    ]
},

更新的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'
        }
    ]
},

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'
        }
    ]
},

---

在VSCode中遇到同样的问题。但是，对于VSCode和WebStorm，服务器都在运行和工作。如何消除这些错误？看起来它无法识别ES6功能=您的babel未配置properly@smnbbrv我不太明白。为什么我必须配置我的babel？这个例子直接来自angular网站。它应该不起作用吗？