Skip to content

Instantly share code, notes, and snippets.

@JMSantos94
Created March 3, 2018 07:23
Show Gist options
  • Select an option

  • Save JMSantos94/c61833bcc716e338e2729bcc7fccbd59 to your computer and use it in GitHub Desktop.

Select an option

Save JMSantos94/c61833bcc716e338e2729bcc7fccbd59 to your computer and use it in GitHub Desktop.
webpack-serve issues with __webpack_require__
import React from 'react';
import { hot } from 'react-hot-loader';
import './main.css';
const App = () => (
<h1>Hello Webpack-serve</h1>
);
export default hot(module)(App);
import React from 'react';
import { render } from 'react-dom';
import App from './App';
render(
<App />,
document.getElementById('app')
);
/* Any CSS rules */
body {
background-color: black;
color: white
}
const webpack = require('webpack');
const path = require('path');
const history = require('connect-history-api-fallback');
const convert = require('koa-connect');
module.exports = {
mode: 'development',
resolve: {
extensions: ['.js', '.jsx', '.json']
},
entry: [
'webpack-hot-middleware/client',
path.resolve(__dirname, 'index.js')
],
serve: {
content: [__dirname],
open: true,
port: 3000,
hot: {
hot: true
},
add: (app, middleware, options) => {
app.use(convert(history()));
}
},
plugins: [
new webpack.HotModuleReplacementPlugin()
],
module: {
rules: [
{
test: /\.jsx?$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader',
options: {
cacheDirectory: true,
presets: [
'react',
'stage-1',
'env'
],
plugins: [
'react-hot-loader/babel'
]
}
}
},
{
test: /\.css$/,
loader: ['style-loader', 'css-loader']
}
]
}
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment