React/Redux/Karma/Jasmine/Webpackを実行しています

Question

カルマ/ Webpackを実行する際に基本的な読み込みエラーが発生しました。

私の主なapp/webサイトでは、Webpackを使って、エクスポートされたReactモジュールをバンドルしています。

私はWebPACKのとカルマをキックオフするために私のNPMテストを実行すると、私はこのエラーを取得する

ERROR in ./app/react/components/bots/botShowContainer.js 
    Module build failed: SyntaxError: D:/development/poc9-unittests/app/react/components/bots/botShowContainer.js: Unexpected token (11:8) 


    9 | const BotShowUI = ({ bot, onClick }) => { 
    10 |  return(
> 11 |   <div id={bot.id} onClick={onClick}> 
    |  ^
    12 |    {bot.id} : {bot.text} 
    13 |   </div> 
    14 | ) 

私は、NPMをインストール

https://github.com/bikerboyroy/poc.git

それにこの小さなプロジェクトをGitHubのレポを作成しましたローカルホストを実行するための

NPM開始：8080

NPMテストへあなたがテストは、インポート/エクスポートに失敗したが反応する構文について訴えている

失敗しているカルマのテストを参照してくださいよとカルマが

をテスト実行します。よくわかりません ！

注： Webアプリケーションは、角度1.4で起動し、Reactに橋渡しします。 角度ブートストラップ/スタートアップではなくリアクション側のテストに興味があります

Answer 1

babelrcをbabel-preset-reactに変更しても問題ありません。これでエラーが発生していることがわかりました。なぜなら、jsx構文をどのように変換するかを知っていなかったからです。

{ 
    "presets": ["es2015", "react"] 
} 

さておき、あなたはすでにあなたのプロジェクトにbabelrcを持っているように、バベルローダーセクションでのWebPACKで、クエリオプションを指定する必要はありません。

あなたのローダはちょうどこのようにすることができます： -

{ 
    test: /\.js$/, 
    loader: "babel", 
    exclude: [/node_modules/, "app/**/*.spec.js"] 
    },