npm @symfony/webpack-encore 0.21.0
v0.21.0: The Webpack 4 Release!

latest releases: 4.6.1, 4.6.0, 4.5.0...
5 years ago

Webpack 4 and so much more 🎇! This is a huge release that contains some backwards-compatibility breaks or changes.

To upgrade, change your version constraint to ^0.21.0 and run yarn upgrade.

You may also need to make a few other changes if you're a Symfony user:

  • composer require symfony/webpack-encore-bundle
  • Replace your manual script and link tags with the new encore_entry_script_tags() and encore_entry_link_tags() functions from that bundle.

Highlights

  • [BC BREAK] Webpack was upgraded to version 4. This includes a number of major
    and minor changes. The changes are listed below under the
    Webpack 4 Upgrade section.

  • [DEPRECATION] You must now call either Encore.enableSingleRuntimeChunk()
    or Encore.disableSingleRuntimeChunk(): not calling either method is
    deprecated. The recommended setting is Encore.enableSingleRuntimeChunk().
    This will cause a new runtime.js file to be created, which must be included
    on your page with a script tag (before any other script tags for Encore
    JavaScript files). See the documentation above enableSingleRuntimeChunk() in
    index.js for more details.

  • [BEHAVIOR CHANGE] Previously, without any config, Babel was
    configured to "transpile" (i.e. re-write) your JavaScript so
    that it was compatible with all browsers that currently have
    more than 1% of the market share. The new default behavior
    is a bit more aggressive, and may rewrite even more code to
    be compatible with even older browsers. The recommendation
    is to add a new browserslist key to your package.json file
    that specifies exactly what browsers you need to support. For
    example, to get the old configuration, add the following to
    package.json:

{
    "browserslist": "> 1%"
}

See the browserslist library
for a full description of all of the valid browser descriptions.

  • Added a new copyFiles() method that is able to copy static files
    into your build directory and allows them to be versioned. #409
    thanks to @Lyrkan

  • Introduced a new configureSplitChunks() method that can be
    used to further configure the optimizations.splitChunks configuration.

  • A new entrypoints.json file is now always output. For expert
    use-cases, the optimizations.splitChunks.chunks configuration
    can be set via configureSplitChunks() to all. Then, you
    can write some custom server-side code to parse the entrypoints.js
    so that you know which script and link tags are needed for
    each entry.

  • The "dynamic import" syntax is now supported out of the box
    because the @babel/plugin-syntax-dynamic-import babel plugin
    is always enabled. This allows you to do "Dynamic Imports"
    as described here: https://webpack.js.org/guides/code-splitting/#dynamic-imports

  • A new "version check" system was added for optional dependencies.
    Now, when you install optional plugins to support a feature, if
    you are using an unsupported version, you will see a warning.
    "Package recommendation" errors (i.e. when you enable a feature
    but you are missing some packages) will also contain the version
    in the install string when necessary (e.g. yarn add foo@^2.0).

  • Support was added handlebars-loader by calling enableHandlebarsLoader().
    #301 thanks to @ogiammetta

  • Support was added for eslint-loader by calling enableEslintLoader().
    #243 thanks to @pinoniq

  • The css-loader can now be configured by calling configureCssLoader().
    #335 thanks to @XWB

  • It's now possible to control the exclude for Babel so that you can
    process certain node_modules packages through Babel - use
    the new second argument to configureBabel() - #401 thanks to
    @Lyrkan.

Webpack 4 Upgrade Details

  • Node 7 is no longer supported. This is because the new
    mini-css-extract-plugin does not support it (and neither)
    does Yarn.

  • For Preact, the necessary plugin the user needs to install
    changed from babel-plugin-transform-react-jsx to @babel/plugin-transform-react-jsx.

  • The NamedModulesPlugin was removed.

  • The babel-preset-env package (which was at version ^1.2.2) was
    removed in favor of @babel/preset-env.

  • ExtractTextPlugin was removed and replaced with
    mini-css-extract-plugin. Accordingly, extractTextPluginOptionsCallback()
    was removed.

  • Support for CoffeeScript was entirely removed.

  • Actual lang="sass" no longer works for Vue. However, lang="scss"
    continues to work fine.

  • uglifyjs-webpack-plugin was replaced by terser-webpack-plugin.
    If you're using configureUglifyJsPlugin(), please switch to
    configureTerserPlugin() instead.

Don't miss a new webpack-encore release

NewReleases is sending notifications on new releases.