webpackをv3からv4にしたらwebpack.config.jsで怒られた

webpackがエラーを吐いたのでその原因と修正について。
結論から言うと、webpackのバージョンによってwebpack.config.jsの記述方法が異なっていたことが原因でした。

エラー

Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
 - configuration.resolve has an unknown property 'root'. These properties are valid:
   object { alias?, aliasFields?, cachePredicate?, cacheWithContext?, descriptionFiles?, enforceExtension?, enforceModuleExtension?, extensions?, fileSystem?, mainFields?, mainFiles?, moduleExtensions?, modules?, plugins?, resolver?, symlinks?, unsafeCache?, useSyncFileSystemCalls? }
 - configuration.resolve.extensions[0] should not be empty.

解決方法

resolve: {
-   root: ['path_to_source'],
+   modules: ['path_to_source'],

-   extensions: ['', '.js']
+   extensions: ['.js']
  },

変更点

• resolve.root -> resolve.modules
• extensionsで空文字''が使えなくなった