2016-05-02 13 views
0

Hallo ich bin neu in reagieren Ich beginne gerade zu lernen rectjs. Ich habe einige Probleme und ich weiß nicht, wie ich es beheben kann.React und Webpack entsprechenden Loader Fehler

Das ist mein package.json Datei

{ 
    "name": "react", 
    "version": "1.0.0", 
    "description": "", 
    "main": "index.js", 
    "scripts": { 
    "test": "echo \"Error: no test specified\" && exit 1" 
    }, 
    "author": "", 
    "license": "ISC", 
    "dependencies": { 
    "babel-core": "5.8.*", 
    "babel-loader": "5.3.*", 
    "react": "0.13.*", 
    "webpack": "1.12.*", 
    "webpack-dev-server": "1.10.*" 
    } 
} 

webpack.config, js

module.exports = { 
    entry: [ 
     './src/App.js' 
    ], 
    output: { 
     path: __dirname, 
     filename: 'app.js' 
    }, 
    module: { 
     loader: [{ 
      test: /\.jsx?$/, 
      loader: 'babel' 
     }] 
    } 
}; 

Datei und app.js Datei

import React from 'react'; 

class App extends React.Component { 
    render() { 
     return (
      <div> 
       <h1>alo</h1> 
      </div> 
     ) 
    } 
} 

React.render(<App />, document.getElementById('app')); 

und der Fehler, wenn ich laufen webpack

ERROR in ./src/App.js 
Module parse failed: C:\Users\mkrtc\Desktop\react\src\App.js Line 1: Unexpected token 
You may need an appropriate loader to handle this file type. 
| import React from 'react'; 
| 
| class App extends React.Component { 
@ multi main 
+3

Typo. Es sollte 'loaders: [...' anstelle von 'loader: [ – Kujira

+0

OK danach geben Sie diesen Fehler FEHLER in ./src/App.js Modul Build fehlgeschlagen: SyntaxError: C:/Benutzer /mkrtc/Desktop/react/src/App.js: Unerwartetes Token (6: 3) 4 | render() { 5 | return ( > 6 |

| ^ 7 |

alo

8 |
9 |) –

+0

Möglicherweise duplizieren http://stackoverflow.com/questions/36964724/webpack-is-not-finding-my-imports-or-converting-my-es6-code/36964951# 36964951 –

Antwort

0

Sie müssen Ihre Babel-Konfiguration einrichten. Im Gegensatz zu Babel 5 macht Babel 6 nichts aus der Box. Plugins und Presets müssen gesetzt werden. Erstellen Sie eine .bablerc Datei auf Root-Ebene wie folgt aus:

"presets": [ 
    "react", 
    "stage-0" 
], 

dies ermöglicht es, die Funktionen von Presets react und stage-0

Verwandte Themen