はHMRに
server.js
var express = require('express')
var app = express()
var morgan = require('morgan')
var env = app.get('env')
if (env == 'development') {
var webpack = require('webpack')
var webpackDevMiddleware = require('webpack-dev-middleware')
var webpackHotMiddleware = require('webpack-hot-middleware')
var config = require('./webpack.config')
var compiler = webpack(config)
app.use(webpackDevMiddleware(compiler, { noInfo: true, publicPath: config.output.publicPath }))
app.use(webpackHotMiddleware(compiler))
app.use(morgan('dev'))
app.get("/", function(req, res) {
res.sendFile(__dirname + '/index.html')
})
}
app.listen(8080, function(error) {
if (error) {
console.error(error)
} else {
console.info("==> Listening on port %s. Open up http://localhost:%s/ in your browser.", 8080, 8080)
}
})
とwebpack.config.js(私はかなり最小限それを残すために、いくつかの混乱を取り除く)
var path = require('path');
var webpack = require('webpack');
module.exports = {
entry: [
'webpack-hot-middleware/client',
'./index',
],
output: {
path: __dirname,
filename: 'bundle.js',
publicPath: '/static/'
},
plugins: [
new webpack.optimize.OccurenceOrderPlugin(),
new webpack.HotModuleReplacementPlugin(),
new webpack.NoErrorsPlugin()
],
module: {
loaders: [
{test: /.jsx?$/, loader: 'babel-loader', exclude: /node_modules/, query: {presets: ['es2015', 'react']} },
]
},
};
をして、私の最小限の急行設定です
これは、WebpackをExpressサーバーに組み込むのに十分な情報を提供するはずです。
このような作業をするためには、すべてのフープを飛び越える必要はありません。 https://facebook.github.io/react/blog/2016/07/22/create-apps-with-no-configuration.html –