webpack 4.0.0-alpha.0 feedback

Big changes

  • Node.js 4 is no longer supported. Source Code was upgraded to a higher ecmascript version.
  • You have to choose (mode or --mode) between two modes now: production or development
    • production enables all kind of optimizations to generate optimized bundles
    • development enables comments and hint for development and enables the eval devtool
      • WIP: addition hints in development mode
    • production doesn’t support watching, development is optimized for fast incremental rebuilds
    • production also enables module concatenating (Scope Hoisting)
    • You can configure this in detail with the flags in optimization.* (build your custom mode)
    • process.env.NODE_ENV are set to production or development (only in build code, not in config)
    • There is a hidden none mode which disables everything
  • import() returns always a namespace object. CommonJS modules are wrapped into the default export
    • This probably breaks your code, if you used to import CommonJs with import()
  • You no longer need to use these plugins:
    • NoEmitOnErrorsPlugin -> optimize.noEmitOnErrors (on by default in production mode)
    • ModuleConcatenationPlugin -> optimize.concatenateModules (on by default in production mode)
  • webpack now handles JSON different
    • You may need to add type: "javascript/auto" when transforming JSON via loader to JS
    • Just using JSON without loader should still work

Big features

  • webpack now supports these module types:
    • javascript/auto: (The default one in webpack 3) Javascript module with all module systems enabled: CommonJS, AMD, ESM
    • javascript/esm: EcmaScript modules, all other module system are not available
    • json: JSON data, JSON data is passed through unchanged and isn’t parsed
    • webassembly/experimental: WebAssembly modules (currently experimental)
  • javascript/esm handles ESM more strict compared to javascript/auto:
    • Imported names need to exist on imported module
    • Non-ESM can only imported via default import, everything else (including namespace import) emit errors
  • In .mjs modules
    • javascript/esm is used
    • imports need to have an extension. No extensions are tried.
  • sideEffects: false is now supported in package.json
  • Instead of a JSONP function a JSONP array is used -> async support
    • WIP: There is no way to move runtime to another chunk yet
  • webpackInclude and webpackExclude are supported by the magic comment for import(). They allow to filter files when using a dynamic expression.
  • Resolving can now be configured with module.rules[].resolve. It’s merged with the global configuration.
  • Sone Plugin options are now validated
    • WIP: Better output, no process exit, stack trace, more plugins
  • Multiple performance improvements, especially for faster incremental rebuilds


  • Plugins added via CLI are prepended to take priority over config plugins
  • Module type is automatically choosen for mjs, json and wasm extensions. Other extensions need to be configured via module.rules[].type
  • added loaderContext.rootContext which points to the context options. Loaders may use it to make stuff relative to the application root.
  • Error for chunk loading now includes more information and two new properties type and request.
  • Incorrect options.dependencies configurations now throw error
  • webpacks AST can be passed directly from loader to webpack to avoid extra parsing
  • When using more than 25 exports mangled export names are shorter.
  • webpack now looks for the .wasm, .mjs, .js and .json extensions in this order
  • Sizes are now shown in kiB instead of kB in Stats
  • A resource query is supported in context
  • output.pathinfo is now on by default in develoment mode
  • in-memory caching is now off by default in production
  • script tags are no longer text/javascript and async as this are the default values (saves a few bytes)


  • Generated comments no longer break on */
  • webpack no longer modifies the passed options object
  • Compiler “watch-run” hook now has the Compiler as first parameter
  • add chunkCallbackName to the schema to allow configurating WebWorker template

Removed features

  • removed module.loaders
  • removed loaderContext.options
  • removed Compilation.notCacheable flag
  • removed NoErrorsPlugin
  • removed Dependency.isEqualResource
  • removed NewWatchingPlugin

Breaking changes for plugins

  • new plugin system
    • plugin method is backward-compatible
    • Plugins should use Compiler.hooks.xxx.tap(<plugin name>, fn) now
  • New major version of enhanced-resolve
  • Templates for chunks may now generate multiple assets
  • Chunk.chunks/parents/blocks are no longer Arrays. A Set is used internally and there are methods to access it.
  • Parser.scope.renames and Parser.scope.definitions are no longer Objects/Arrays, but Map/Sets.
  • Parser uses StackedSetMap (LevelDB-like datastructure) instead of Arrays
  • Compiler.options is no longer set while applying plugins
  • Harmony Dependencies has changed because of refactoring
  • Dependency.getReference() may now return a weak property. Dependency.weak is now used by the Dependency base class and returned in the base impl of getReference()
  • Constructor arguments changed for all Modules
  • Merged options into options object for ContextModule and resolveDependencies
  • Changed and renamed dependencies for `import()
  • Moved Compiler.resolvers into Compiler.resolverFactory accessible with plugins
  • Dependency.isEqualResource has been replaced with Dependency.getResourceIdentifier

Incompatible plugins

Please comment

Incompatible loaders

  • file-loader -> Workaround A
  • vue-loader -> Workaround A
  • ejs-loader -> Workaround A
  • eslint-loader -> Workaround A
  • postcss-loader

Please comment

Broken features

Please comment


Workround A

For loaders not migrated away from using this.options:

new LoaderOptionsPlugin({
  options: {
    context: process.cwd() // or the same value as `context`

Don’t expect this alpha release to be super stable yet…

Please comment if you find additional changes not in the changelog

Author: Fantashit

4 thoughts on “webpack 4.0.0-alpha.0 feedback

Comments are closed.