具有babel-loader屬性類型的Webpack

Question

我正在嘗試使用Webpack將節點打字稿應用程序（帶有Exprees js服務器）遷移到ES2015。 首先，我想使用屬性類型。 我創建了比使用babel-loader和eslint所需的工具。 因此，我安裝了此軟件包並將其實施到我的快速應用程序中：

這是我的webpack.config.js

const webpack = require('webpack');
const WebpackErrorNotificationPlugin = require("webpack-error-notification");
module.exports = 
{
    entry: './src/test/test.js',
    target: 'node',
    debug: true,
    output: {
        path: './bin',
        filename: 'test.bundle.js',
    },
    module: {
        preLoaders: [{
            test: /\.js?$/,
            loaders: ['eslint'],
            exclude: /node_modules/
        }],
        loaders: [{
            test: /\.js?$/,
            exclude: /node_modules/,
            loader: 'babel',
        }]
    },
    eslint: {
        failOnWarning: false,
        failOnError: true
    },
    plugins: [
        new webpack.optimize.UglifyJsPlugin({
            compress: {
                warnings: false,
            },
            output: {
                comments: false,
            },
        }),
        new WebpackErrorNotificationPlugin()
    ]
}

.eslintrc

{
  "parser": "babel-eslint",
  "parserOptions": {
    "sourceType": "module",
    "allowImportExportEverywhere": false
  }
}

和錯誤代碼之一：

export class CmsUserModel {
    /**
     * (description)
     * 
     * @type {String}
     */
    template: string;

    /**
     * (description)
     * 
     * @type {string}
     */
    pages: string[];

    constructor() {
        this.template = "";
        this.pages = new Array<string>();
    }

       public static ToModel(model: ICmsUserModel) {
         return <CmsUserModel>{
             template : model.template,
             pages : model.pages
         };       
     }
}

有兩個問題。 首先是，然后未對babal-eslint錯誤處理進行指定。 例如：

ERROR in ./src/models/cmsUserModel.js

/Users/petrtomasek/Projects/cms/src/models/cmsUserModel.js
  44:40  error  Parsing error: Unexpected token

✖ 1 problem (1 error, 0 warnings)


ERROR in ./src/models/cmsUserModel.js
Module build failed: Error: Module failed because of a eslint error.

/Users/petrtomasek/Projects/cms/src/models/cmsUserModel.js
  44:40  error  Parsing error: Unexpected token

✖ 1 problem (1 error, 0 warnings)

很好，但是我希望看到標准錯誤處理，如可能的話，在默認的webpack和babel loader中顯示當前錯誤行。

第二個錯誤是，那么我仍然無法使用屬性類型，例如： template: string

請問怎么了 謝謝你的時間！

Answer 1

我認為您應該嘗試以下步驟，

1. npm install --save-dev babel-preset-es2015
2. Add query: { presets: ['es2015'] } to your webpack config with the babel loader.

loaders: [{
            test: /\.js?$/,
            exclude: /node_modules/,
            loader: 'babel',
            query: { presets: ['es2015'] }
        }]