I'm new in React.js. I created project with 'create-react-app' command. I wanted to add server, so eject project. But files that located under the src folder don't appear on localhost:4000. I can see contents in index.html. What is my problem?
Here is my package.json scripts
"scripts": {
"development": "cross-env NODE_ENV=development nodemon --exec babel-node --presets=es2015 ./server/main.js --watch server"
}
And this is webpack.dev.config.js
var webpack = require('webpack');
var path = require('path');
module.exports = {
entry: [
'babel-polyfill',
'./src/index.js',
'webpack-dev-server/client?http://0.0.0.0:4000',
'webpack/hot/only-dev-server',
'./src/style.css'
],
output: {
path: '/',
filename: 'bundle.js'
},
devServer: {
hot: true,
filename: 'bundle.js',
publicPath: '/',
historyApiFallback: true,
contentBase: './public',
proxy: {
"*": "http://localhost:3000"
}
},
plugins: [
new webpack.HotModuleReplacementPlugin()
],
resolve: {
modules: [path.resolve("./src"), 'node_modules']
},
module: {
loaders: [
{
test: /\.js$/,
loaders: ['babel-loader?' + JSON.stringify({
cacheDirectory: true,
presets: ['es2015', 'react']
})],
exclude: /node_modules/,
},
{
test: /\.css$/,
loader: 'style-loader!css-loader'
}
]
}
};
webpack-dev-server loads only the content of index.html
because it doesn't see the bundle file bundle.js
. In your configuration, the destination of the bundle file is the directory '/'
.
output: {
path: '/',
filename: 'bundle.js'
}
But webpack-dev-server
serve contents from './public'
directory ( contentBase: './public'
). You should tell webpack to look at public directory and root directory like this
devServer: {
hot: true,
filename: 'bundle.js',
publicPath: '/',
historyApiFallback: true,
contentBase: ['/', '/public'],
proxy: {
"*": "http://localhost:3000"
}
}
Don't forget to reference the bundle file in index.html.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.