Question

无法让简单的hello世界发挥作用！

server.js

var webpack = require('webpack')
var WebpackDevServer = require('webpack-dev-server')
var config = require('./webpack.config')

new WebpackDevServer(webpack(config), {
  publicPath: config.output.publicPath,
  hot: true,
  inline: true,
  historyApiFallback: true
}).listen(3000, '0.0.0.0', function (err, result) {
  if (err) {
    console.log(err)
  }

  console.log('Listening at 0.0.0.0:3000')
})

webpack.config.js

var path = require("path")
var webpack = require('webpack')
var BundleTracker = require('webpack-bundle-tracker')

module.exports = {
    context: __dirname,

    entry: [
        './assets/js/index', // entry point of our app. assets/js/index.js should require other js modules and dependencies it needs
        'webpack-dev-server/client?http://localhost:3000',
        'webpack/hot/only-dev-server',

    ],

    output: {
        path: path.resolve('./assets/bundles/'),
        filename: "[name]-[hash].js",
        publicPath: 'http://localhost:3000/assets/bundles/', // Tell django to use this URL to load packages and not use STATIC_URL + bundle_name
    },

    plugins: [
        new webpack.HotModuleReplacementPlugin(),
        new webpack.NoEmitOnErrorsPlugin(), // don't reload if there is an error
        new BundleTracker({filename: './webpack-stats.json'}),
    ],

    module: {
        loaders: [
            {
                test: /\.jsx?$/,
                exclude: /node_modules/,
                loaders: ['react-hot-loader/webpack', 'babel-loader?presets[]=react'],
            }, // to transform JSX into JS
        ],
    },

    resolve: {
        modules: ['node_modules', 'bower_components'],
        extensions: ['.js', '.jsx']
    },
}

的index.html

{% load render_bundle from webpack_loader %}
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Example</title>
  </head>

  <body>
    <div id="react-app"></div>
    {% render_bundle 'main' %}
  </body>
</html>

index.js

var React = require('react')
var ReactDOM = require('react-dom')
var App = require('./app')

var Hello = React.createClass ({
    render: function() {
        return (
            <h1>
            Hello, World!
            </h1>
        )
    }
})

ReactDOM.render(<Hello />, document.gectElementById('react-app'))

我已将React与Django集成，尝试设置热重载。然而，这个错误似乎与django或者任何反应无关。可能我错过了webpack-dev-server的东西。

webpack-dev-server：无法获取/

0 个答案: