ERRORは、失敗したビルド：でSyntaxError：デコレーターが正式

Question

をサポートされていない私は、パッケージがインストールされているので、

import React from 'react'; 
// http://glortho.github.io/react-keydown/example/index.html 
import keydown from 'react-keydown'; 

import {Grid, Row, Column} from 'react-cellblock'; 

import MyComponent from '../utils/MyComponent'; 

@keydown 
export default class BasicList extends MyComponent { 

の

ERROR in ./src/components/BasicList.js 
Module build failed: SyntaxError: Decorators are not officially supported yet in 6.x pending a proposal update. 
However, if you need to use them you can install the legacy decorators transform with: 

npm install babel-plugin-transform-decorators-legacy --save-dev 

and add the following line to your .babelrc file: 

{ 
    "plugins": ["transform-decorators-legacy"] 
} 

を取得しています何度も尋ねられ、それがうまくいかない理由についてはまだ混乱しています。

.babelrc：

{ 
    "presets": ["react", "es2015", "stage-1"], 
    "plugins": ["transform-decorators-legacy"] 

} 

パッケージ：

"devDependencies": { 
    "babel-core": "^6.2.1", 
    "babel-loader": "^6.2.0", 
    "babel-plugin-transform-decorators-legacy": "^1.3.4", 
    "babel-preset-es2015": "^6.1.18", 
    "babel-preset-react": "^6.1.18", 
    "chai": "^3.5.0", 
    "chai-jquery": "^2.0.0", 
    "jquery": "^2.2.1", 
    "jsdom": "^8.1.0", 
    "json-loader": "^0.5.4", 
    "mocha": "^2.4.5", 
    "react-addons-test-utils": "^0.14.7", 
    "webpack": "^1.12.9", 
    "webpack-dev-server": "^1.14.0" 
    }, 
    "dependencies": { 
    "babel-preset-stage-1": "^6.1.18", 
    "lodash": "^3.10.1", 
    "react": "^0.14.3", 
    "react-cellblock": "^3.0.0", 
    "react-dom": "^0.14.3", 
    "react-keydown": "^1.7.3", 
    "react-redux": "4.3.0", 
    "react-router": "^2.8.1", 
    "react-select": "^1.0.0-rc.5", 
    "redux": "^3.0.4", 
    "requests": "^0.1.7", 
    "underscore": "^1.8.3" 
    } 
} 

webpack.config.js：

module.exports = { 
    entry: [ 
    './src/index.js' 
    ], 
    output: { 
    path: __dirname, 
    publicPath: '/', 
    filename: 'bundle.js' 
    }, 
    module: { 
    loaders: [{ 
     exclude: /node_modules/, 
     loader: 'babel', 
     query: { 
     presets: ['react', 'es2015', 'stage-1'] 
     } 
    }] 
    }, 
    resolve: { 
    extensions: ['', '.js', '.jsx'] 
    }, 
    devServer: { 
    historyApiFallback: true, 
    contentBase: './' 
    } 
}; 

これについてのすべての答えは、私はすでにやったことをやって言います。私は無駄にnpmサーバーを再起動し続けます。

Answer 1

問題はwebpack.config.jsファイルにあります。 正しい設定ファイルは、ローダー内のキー照会を使わないでください。これらの設定ファイルはすべて.babelrcファイル内で既に指定されているためです。

ファイルwebpack.config.js更新する必要があります： -

module.exports = { 
    entry: [ 
    './src/index.js' 
    ], 
    output: { 
    path: __dirname, 
    publicPath: '/', 
    filename: 'bundle.js' 
    }, 
    module: { 
    loaders: [{ 
     exclude: /node_modules/, 
     loader: 'babel' 
    }] 
    }, 
    resolve: { 
    extensions: ['', '.js', '.jsx'] 
    }, 
    devServer: { 
    historyApiFallback: true, 
    contentBase: './' 
    } 
};