用的WebPack，ES6，簡單的成分反應不顯示

這是我webpack-config.js：用的WebPack，ES6，簡單的成分反應不顯示

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

我創建簡單的組件App.js：

import React from 'react'; 

export default class App extends React.Component{ 
    render(){ 
     return <h1>Hello</h1> 
    } 
}

和我main.js：

import React from 'react'; 
import { render } from 'react-dom'; 
import App from './components/App.js'; 

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

我的index.html：

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
</head> 
<body> 
    <div id="main"></div> 
    <script src="bundle.js">,/scrip> 
</body> 
</html>

當我運行webpack-dev-server時，沒有錯誤，它是服務器右側的文件夾，但是我看到空的頁面，在WEB控制檯沒有錯誤。我看到它加載正確的文件，編號爲main，但多數民衆贊成在所有。

問題在哪裏？

來源

2016-11-25 gdfgdfg

你有一個'index.html'？ –

是的，就像我寫的'我看到它加載正確的文件與id主' – gdfgdfg

你有沒有鏈接你的bundle.js與'

您的文件被命名爲App.jsx，但是你想從App.js

來源

2016-11-26 00:18:35 danidee

'App.js'，sry類型錯誤。已更改。 – gdfgdfg

相關問題