I've created two configs for webpack.

When I'm exporting an array of configs: everything works, instead of watch option. The tasks simply finish (with success).

When I test one configuration exports - watch works fine.

I've tried multiple entry points, and watch worked also fine that time, but config looked a little messy.

I'll atach my configs, hope for advices, thanks.

/* FRONT-END CONFIG */
var frontWebpackConfig = {
  entry: "./src/front/app",

  output: {
    path: __dirname + "/build",
    filename: "public/app.js"
  },

  watch: NODE_ENV == "development",

  watchOptions : {
    aggregateTimeout: 100
  },

  devtool : NODE_ENV == "development" ? "cheap-inline-module-source-map" : null,

  plugins : [
    new webpack.NoErrorsPlugin(),
    new webpack.DefinePlugin({
      NODE_ENV : JSON.stringify(NODE_ENV)
    })
  ],

  module : {
    loaders : [
      {
        test : /\.js$/,
        loader : 'babel',
        query: {
          presets: ['es2015']
        }
      },
      { test: /\.css$/, loader: "style-loader!css-loader" }
    ]
  }
};


/* BACK-END CONFIG */
var backWebpackConfig = {
  entry: "./src/back/server",

  target : 'node',

  output: {
    path: __dirname + "/build",
    filename: "server.js"
  },

  externals: nodeModules,

  watch: NODE_ENV == "development",

  watchOptions : {
    aggregateTimeout: 100
  },

  devtool : NODE_ENV == "development" ? "cheap-inline-module-source-map" : null,

  plugins : [
    new webpack.NoErrorsPlugin(),
    new webpack.DefinePlugin({
      NODE_ENV : JSON.stringify(NODE_ENV)
    })
  ],

  module : {
    loaders : [
      {
        test : /\.js$/,
        loader : 'babel',
        query: {
          presets: ['es2015']
        }
      }
    ]
  }
}


/* EXPORTS */
module.exports = [frontWebpackConfig, backWebpackConfig]

Also, I've cheked this expressions: "NODE_ENV == "development" " value, and tried to set true directly.

Update: funny thing, I've just tried to launch with "--watch" option in mand line and it worked fine. Any ideas why file config doesn't work?

I've created two configs for webpack.

When I'm exporting an array of configs: everything works, instead of watch option. The tasks simply finish (with success).

When I test one configuration exports - watch works fine.

I've tried multiple entry points, and watch worked also fine that time, but config looked a little messy.

I'll atach my configs, hope for advices, thanks.

/* FRONT-END CONFIG */
var frontWebpackConfig = {
  entry: "./src/front/app",

  output: {
    path: __dirname + "/build",
    filename: "public/app.js"
  },

  watch: NODE_ENV == "development",

  watchOptions : {
    aggregateTimeout: 100
  },

  devtool : NODE_ENV == "development" ? "cheap-inline-module-source-map" : null,

  plugins : [
    new webpack.NoErrorsPlugin(),
    new webpack.DefinePlugin({
      NODE_ENV : JSON.stringify(NODE_ENV)
    })
  ],

  module : {
    loaders : [
      {
        test : /\.js$/,
        loader : 'babel',
        query: {
          presets: ['es2015']
        }
      },
      { test: /\.css$/, loader: "style-loader!css-loader" }
    ]
  }
};


/* BACK-END CONFIG */
var backWebpackConfig = {
  entry: "./src/back/server",

  target : 'node',

  output: {
    path: __dirname + "/build",
    filename: "server.js"
  },

  externals: nodeModules,

  watch: NODE_ENV == "development",

  watchOptions : {
    aggregateTimeout: 100
  },

  devtool : NODE_ENV == "development" ? "cheap-inline-module-source-map" : null,

  plugins : [
    new webpack.NoErrorsPlugin(),
    new webpack.DefinePlugin({
      NODE_ENV : JSON.stringify(NODE_ENV)
    })
  ],

  module : {
    loaders : [
      {
        test : /\.js$/,
        loader : 'babel',
        query: {
          presets: ['es2015']
        }
      }
    ]
  }
}


/* EXPORTS */
module.exports = [frontWebpackConfig, backWebpackConfig]

Also, I've cheked this expressions: "NODE_ENV == "development" " value, and tried to set true directly.

Update: funny thing, I've just tried to launch with "--watch" option in mand line and it worked fine. Any ideas why file config doesn't work?

• javascript
• webpack

Share Improve this question Follow asked May 10, 2016 at 7:40 LazyexpertLazyexpert 3,16411 gold badge2222 silver badges3333 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 5

watch isn't a configuration option in Webpack. As you've suggested you need to either pass it on the CLI or call watch instead of run when using the Node API:

piler.watch({ ...watchOptions }, function(err, stats) {
    // ...
});

Actually, there is an option for watch in webpack 1.13.0+.

But it seems, that in case of several configurations (array of objects) watch property should be set to the array to make it work. Eventually watchOptions property of the first configuration object would be used.

/* FRONT-END CONFIG */
var frontWebpackConfig = {
    entry: "./src/front/app",
    // ...
    watch: NODE_ENV == "development",
    watchOptions : {
        aggregateTimeout: 100,
    },
};

/* BACK-END CONFIG */
var backWebpackConfig = {
    entry: "./src/back/server",
    // ...
};

var configuration = [frontWebpackConfig, backWebpackConfig];
configuration.watch = true;

/* EXPORTS */
module.exports = configuration;

--watch argument in the mand line just sets watch property to the array during configuration loading and processing, that's why using CLI argument works as it's expected.