Webpack在JS文件中的意外令牌

Question

我正在學習反應和流量，並且在第1課中教程使我失敗了。

This tutorial立即打破對「NPM啓動」具有以下錯誤：

ERROR in ./src/js/main.js 
Module parse failed: /Users/me/Projects/egghead-flux/src/js/main.js Unexpected token (4:16) 
You may need an appropriate loader to handle this file type. 
SyntaxError: Unexpected token (4:16) 
at Parser.pp$4.raise (/Users/me/Projects/egghead-flux/node_modules/acorn/dist/acorn.js:2221:15) 

它似乎並不明白ReactDOM.render(<App />, document.getElementById('main'));我以爲解析JSX <App />部分失敗。

有沒有人遇到過這個問題？刪除/重新安裝節點模塊不會執行任何操作。視頻中是否缺少一些設置步驟？

Main.js

import React from 'react'; 
import ReactDOM from 'react-dom'; 
import App from './components/app'; 
ReactDOM.render(<App />, document.getElementById('main')); 

App.js

import React from 'react'; 
    export default class App extends React.Component { 
     render(){ 
      return <h1>Flux</h1> 
     } 
    } 

webpack.config.js

module.exports = { 
    entry: './src/js/main.js', 
    output:{ 
     path:'./dist', 
     filename: 'bundle.js', 
     publicPath: '/' 
    }, 
    devServer: { 
     inline: true, 
     contentBase: './dist' 
    }, 
    module: { 
     loaders: [ 
      { 
       test: '/\.jsx?$/', 
       exclude: /(node_modules|bower_components)/, 
       loader: 'babel', 
       query:{ 
        presets: ['es2015', 'react'] 
       } 
      } 
     ] 
    } 
} 

的package.json

{ 
    "name": "egghead-flux", 
    "version": "1.0.0", 
    "description": "", 
    "main": "index.js", 
    "scripts": { 
    "start": "webpack-dev-server" 
    }, 
    "author": "", 
    "license": "ISC", 
    "dependencies": { 
    "flux": "^3.1.0", 
    "react": "^15.3.2", 
    "react-dom": "^15.3.2", 
    "react-router": "^3.0.0" 
    }, 
    "devDependencies": { 
    "babel": "^6.5.2", 
    "babel-loader": "^6.2.7", 
    "babel-preset-es2015": "^6.18.0", 
    "babel-preset-react": "^6.16.0", 
    "webpack": "^1.13.3", 
    "webpack-dev-server": "^1.16.2" 
    } 
} 

Answer 1

事實證明：

test: '/\.jsx?$/',

應該是：

test: /\.jsx?$/,

該死。