The webpack-dev-server is bundling the html, scss and js files successfully and the output is also getting served on localhost:8080
but the dist folder is not getting created on local. Following is my webpack configuration:
var extractPlugin = new ExtractTextPlugin({
filename: 'main.css'
});
module.exports = {
entry: './src/index.js',
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'bundle.js',
},
devtool: 'inline-source-map',
devServer: {
port: 3000
},
plugins: [
extractPlugin,
new HtmlWebpackPlugin({
template: 'public/index.html'
}),
new CleanWebpackPlugin(['dist'])
]
};
Webpack will generate the files and put them in the /dist folder for you, but it doesn't keep track of which files are actually in use by your project. In general it's good practice to clean the /dist folder before each build, so that only used files will be generated.
The webpack-dev-server will serve the files in the current directory, unless you configure a specific content base. Using this config webpack-dev-server will serve the static files in your public folder. It'll watch your source files for changes and when changes are made the bundle will be recompiled.
The webpack-dev-server serves the created bundle from memory and does not write it to the dist directory.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With