0
我已經設置爲我的應用的WebPack開發服務器(帶熱負荷的反應),但是當我訪問http://localhost:8080
所有我看到的是的WebPack開發服務器的表現〜/瀏覽器
〜/
在屏幕上。當我運行npm start時,構建表示它已成功編譯。我在Windows 10,通過猛砸建設這個下面是我的webpack.config.js
文件:
// hack for Ubuntu on Windows
try {
require('os').networkInterfaces();
}
catch (e) {
require('os').networkInterfaces =() => ({});
}
const path = require('path');
const webpack = require("webpack");
module.exports = {
devServer: {
hot: true,
contentBase: path.resolve(__dirname, 'dist'),
publicPath: '/'
},
devtool: 'inline-source-map',
entry: [
'react-hot-loader/patch',
'webpack-dev-server/client?http://localhost:8080',
'webpack/hot/only-dev-server',
'./src/app/index.js'
],
module: {
rules: [{
test: /\.js?$/,
use: ['babel-loader'],
exclude: /node_modules/
},{
test: /\.jsx?$/,
use: ['babel-loader?' + JSON.stringify({
presets: ["es2015", "stage-2", "react"]
})],
exclude: /node_modules/
},{
test: /\.css?$/,
use: ['style-loader','css-loader?modules']
},{
test: /\.jpg?$/,
use: ['file-loader']
},{
test: /\.ico$/,
use: ["file-loader"]
},{
test: /\.png$/,
use: ["url-loader?limit=100000"]
},{
test: /\.(woff|woff2)(\?v=\d+\.\d+\.\d+)?$/,
use: ["url-loader?limit=10000&mimetype=application/font-woff"]
},{
test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/,
use: ["url-loader"]
},{
test: /\.eot(\?v=\d+\.\d+\.\d+)?$/,
use: ["file-loader"]
},{
test: /\.svg(\?v=\d+\.\d+\.\d+)?$/,
use: ["url-loader?limit=10000&mimetype=image/svg+xml"]
}]
},
output: {
path: path.resolve(__dirname, 'dist'),
publicPath: '/',
filename: 'bundle.js'
},
plugins: [
new webpack.DefinePlugin({
'process.env': {
'NODE_ENV': JSON.stringify('dev')
}
}),
new webpack.HotModuleReplacementPlugin(),
// enable HMR globally
new webpack.NamedModulesPlugin()
// prints more readable module names in the browser console on HMR updates
],
resolve: {
extensions: ['.js', '.jsx', '.css']
}
};