Webpack-dev-server: Bug or My fail (if use webpack-dev-server files doesn't replace)

Created on 26 Jan 2018  路  3Comments  路  Source: webpack/webpack-dev-server

  • Operating System: Ubuntu 16.04
  • Node Version: v9.4.0
  • NPM Version: 5.6.0
  • webpack Version: 3.10.0
  • webpack-dev-server Version: 2.11.1
  • [x] This is a bug
  • [ ] This is a modification request

If i use npm start and go to http://localhost:8080 + make and save changes webpack don't replace files but if i use webpack --watch all is ok

Code

// webpack.config.js

const path = require('path');

const ExtractTextPlugin = require("extract-text-webpack-plugin");
const postCSS = new ExtractTextPlugin('../css/styles.bundle.css');

module.exports = {
    devServer: {
        port: 8080
    },
  entry: {
    app: './assets/src/js/app.js'
  },
  output: {
    path: path.resolve(__dirname, 'assets/dist/js'),
    filename: '[name].bundle.min.js'
  },
  module: {
    rules: [
        {
            test: /\.jsx?$/,
            exclude: /(node_modules|bower_components)/,
            use: {
                loader: 'babel-loader',
                options: {
                    presets: ['es2015', 'env', 'stage-0', 'react']
                }
            }
        }, 
        {
            test: /\.css$/i,
            include: [
                path.resolve(__dirname, 'assets/src/css'),
            ],
            use: postCSS.extract({
                fallback: 'style-loader',
                use: [
                    {
                        loader: 'css-loader',
                        options: {
                            importLoaders: 1,
                            config: {
                                path: 'postcss.config.js'
                            }
                        }

                    }, 'postcss-loader',
                ],
            }),
        }
    ],
  },
  plugins: [
    postCSS
  ]
};

// package.json

{
  "name": "react-app",
  "version": "1.0.0",
  "description": "",
  "main": "/src/client.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "killall -KILL node; webpack-dev-server --inline --hot --watch-poll"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "babel-cli": "^6.26.0",
    "babel-core": "^6.26.0",
    "babel-loader": "^7.1.2",
    "babel-preset-env": "^1.6.1",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "babel-preset-stage-0": "^6.24.1",
    "css-loader": "^0.28.9",
    "extract-text-webpack-plugin": "^3.0.2",
    "html-webpack-plugin": "^2.30.1",
    "jquery": "^3.3.1",
    "postcss-cssnext": "^3.1.0",
    "postcss-import": "^11.0.0",
    "postcss-loader": "^2.0.10",
    "postcss-nested": "^3.0.0",
    "postcss-plugin": "^1.0.0",
    "style-loader": "^0.19.1",
    "webpack": "^3.10.0",
    "webpack-dev-server": "^2.11.1"
  },
  "dependencies": {
    "bootstrap": "^4.0.0",
    "popper.js": "^1.12.9",
    "react": "^16.2.0",
    "react-dom": "^16.2.0",
    "react-redux": "^5.0.6",
    "react-router": "^4.2.0",
    "react-router-dom": "^4.2.2",
    "react-router-redux": "^4.0.8",
    "redux": "^3.7.2"
  }
}

All 3 comments

Im having this problem too

i can fix this issue after reading documentation right here : https://webpack.js.org/configuration/dev-server/
its turn to be configuration need both contentBase & publicPath. here is configuration that work for me :

devServer:{
        contentBase: path.join(__dirname, "app"),
        publicPath: "/public/",
        compress: true,
        port: 8080
},

Our issue template states that questions should be asked on StackOverflow.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

daryn-k picture daryn-k  路  3Comments

adiachenko picture adiachenko  路  3Comments

antoinerousseau picture antoinerousseau  路  3Comments

vzorge picture vzorge  路  3Comments

tulika21-zz picture tulika21-zz  路  3Comments