Last active
September 24, 2018 19:19
-
-
Save AutoSponge/97c79e96fe9842a10cfc to your computer and use it in GitHub Desktop.
webpack-hot-middleware with separate host
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{ | |
"stage": 0, | |
"env": { | |
"development": { | |
"plugins": ["react-transform"], | |
"extra": { | |
"react-transform": { | |
"transforms": [{ | |
"transform": "react-transform-hmr", | |
"imports": ["react"], | |
"locals": ["module"] | |
}, { | |
"transform": "react-transform-catch-errors", | |
"imports": ["react", "redbox-react"] | |
}] | |
} | |
} | |
} | |
} | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{ | |
"scripts": { | |
"start": "babel-node ./<path to devserver>/server.js" | |
}, | |
"dependencies": { | |
"react": "0.13.3", | |
}, | |
"devDependencies": { | |
"babel-core": "^5.8.25", | |
"babel-loader": "^5.3.2", | |
"babel-plugin-react-transform": "^1.1.1", | |
"express": "^4.13.3", | |
"react-transform": "0.0.3", | |
"react-transform-catch-errors": "^1.0.0", | |
"react-transform-hmr": "^1.0.1", | |
"redbox-react": "^1.1.1", | |
"webpack": "^1.12.2", | |
"webpack-dev-middleware": "^1.2.0", | |
"webpack-hot-middleware": "^2.4.1" | |
} | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import path from 'path'; | |
import express from 'express'; | |
import webpack from 'webpack'; | |
import hot from 'webpack-hot-middleware'; | |
import dev from 'webpack-dev-middleware'; | |
import config from './webpack.config.dev'; | |
const app = express(); | |
const compiler = webpack(config); | |
app.use(dev(compiler, { | |
noInfo: true, | |
publicPath: config.output.publicPath, | |
headers: { | |
'Access-Control-Allow-Credentials': true, | |
'Access-Control-Allow-Origin': 'http://<appserver hostname>:<appserver port>' | |
} | |
})); | |
app.use(hot(compiler)); | |
app.listen(<devserver port>, '<devserver hostname>', err => { | |
if (err) { | |
console.log(err); | |
return; | |
} | |
console.log('Listening at <devserver hostname>:<devserver port>'); | |
}); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import path from 'path'; | |
import webpack from 'webpack'; | |
export default { | |
devtool: 'eval', | |
entry: [ | |
'webpack-hot-middleware/client?path=http://<devserver hostname>:<devserver port>/__webpack_hmr', | |
'./<path to app entry point>' | |
], | |
output: { | |
path: path.join(__dirname, 'dist'), | |
filename: '<public app filename>.js', | |
publicPath: 'http://<devserver hostname>:<devserver port>/<public app path>/' | |
}, | |
plugins: [ | |
new webpack.HotModuleReplacementPlugin(), | |
new webpack.NoErrorsPlugin() | |
], | |
module: { | |
loaders: [{ | |
test: /\.jsx?$/, | |
exclude: /(node_modules|bower_components)/, | |
loader: 'babel' | |
}] | |
} | |
}; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
You have a syntax error in your package file: there is a comma after
"react": "0.13.3"
which invalidates the JSON.