CODEWITHSUNDEEP
webpack
Stefan Hansch
Stefan Hansch

Reputation: 1590

Webpack dont want automatically rebuild all changes in project

webpack v1

vagrant + virtualbox

I have following webpack.config.js:

'use strict';
var _configs = require(__dirname + '/config/build');
var _load = function(env) {
return _configs && _configs(env, __dirname);
};
module.exports = _load(process.env);

config/build.js:

'use strict';
var _ = require('lodash');
var _configs = {
desktop: require('./desktop.js'),
};
module.exports = function(_env, _path) {
var config;
var opt = {
debug: true,
devtool: 'source-map',
watch: true
};
return _.merge(opt, _configs'desktop');

If I change files in project, new data is not updated. I open the browser all same. Only update if again re run webpack. For server I use node http-server.

packege.json

{
  "name": "name",
  "version": "1.0.0",
  "description": "description",
  "main": "index.js",
  "scripts": {
    "build": "webpack",
    "dev": "npm i && npm run build",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "repository": {
    "type": "git",
    "url": "[email protected]:name.git"
  },
  "author": "name",
  "license": "ISC",
  "bugs": {
    "url": "https://github.com/name/name/issues"
  },
  "homepage": "https://github.com/name/name#readme",
  "dependencies": {
    "autoprefixer-loader": "3.2.0",
    "axios": "^0.15.3",
    "babel-core": "^6.16.0",
    "babel-eslint": "^6.1.2",
    "babel-loader": "^6.2.5",
    "babel-plugin-transform-async-to-generator": "^6.5.0",
    "babel-polyfill": "^6.5.0",
    "babel-preset-es2015": "^6.16.0",
    "babel-preset-react": "^6.23.0",
    "babel-preset-stage-0": "^6.0.15",
    "css-loader": "0.22.0",
    "eslint": "^3.17.1",
    "extract-text-webpack-plugin": "1.0.1",
    "file-loader": "^0.11.1",
    "imports-loader": "^0.7.1",
    "lodash": "^4.16.2",
    "lwip": "0.0.9",
    "moment": "^2.16.0",
    "node-sass": "3.4.1",
    "path": "0.12.7",
    "png-sprite-webpack": "git+https://github.com/alexandershved/png-sprite-webpack.git#1.0.2",
    "react": "^0.14.7",
    "react-dom": "^0.14.7",
    "react-router": "^2.8.1",
    "rename": "1.0.3",
    "sass-loader": "3.1.1",
    "swiper": "^3.4.2",
    "webpack": "1.12.2",
    "webpack-assets-manifest": "0.1.2"
  }
}

How to make webpack automatically re-build all changes?

Upvotes: 0

Views: 2726

Answers (2)

IvanM
IvanM

Reputation: 3053

Tip for Linux users: make sure you have enough watchers https://webpack.js.org/configuration/watch/#not-enough-watchers

Upvotes: 0

JuMoGar
JuMoGar

Reputation: 1760

You need to install: webpack-dev-server . With NPM is like so: npm install webpack-dev-server --save

Try to add this into your package.json:

"scripts": {
  "build": "webpack --progress --watch --colors",
  "serve": "webpack-dev-server --progress --colors"
},

Then, when you run npm run serve the changes that you make in your project will be displayed in the browser at the moment. As with the command npm run build (that is to compile the project)

Upvotes: 1

Related Questions