Search code examples
javascriptwebpackwebpack-dev-serverwebpack-style-loader

Webpack-dev-server doesn't build files on change


So I have the following webpack configuration :

import path from 'path';

module.exports = {
    entry: {
    index: './dev/index.js'
    },
    output: {
        path: path.join(__dirname, 'dist'),
        publicPath: './dist/',
        filename: 'bundle.js',
        chunkFilename: '[id].bundle.js'
    },
    module:{
        loader:{
            test: /\.js$/,
            exclude:path.resolve(__dirname, "node_modules"),
            loader: 'js'
        }
    }

};

The problem is that when I do webpack --watchthe file does build in the /dist/ folder at every change. Yet when I run the webpack-dev-server the files don't even build. Why is that?

Please help.


Solution

  • The reason you are not seeing files emitted into your dist folder is because webpack-dev-server uses an in-memory filesystem

    This allows for extremely fast incremental builds when your code changes. This was an intentional design on our part. You can view the resulting code in your browser and never need to reference those files.

    It is not recommended by us, for the sake of build performance, but you can look in to plugins like write-file-webpack-plugin if you need this feature.