A simple but powerful API for processing & compiling assets built around Webpack

Symfony

Last update: Jan 5, 2023

Related tags

Asset Management react sass less babel webpack symfony postcss

Overview

Webpack Encore: A Simple & Powerful Webpack API

Webpack Encore is a simpler way to integrate Webpack into your application. It wraps Webpack, giving you a clean & powerful API for bundling JavaScript modules, pre-processing CSS & JS and compiling and minifying assets. Encore gives you a professional asset system that's a delight to use.

Encore is inspired by Webpacker and Mix, but stays in the spirit of Webpack: using its features, concepts and naming conventions for a familiar feel. It aims to solve the most common Webpack use cases.

Encore is made by Symfony and works beautifully in Symfony applications. But it can easily be used in any application... in any language!

Documentation

Read the Documentation on symfony.com or view a demo application: symfony/demo.

Comments

Upgrade to Webpack 4

As you might have already seen: Webpack 4 beta is out

This beta release is pretty much stable and will be released as such in a month.

As promised, we will wait a month from today before releasing webpack 4 stable

The new release offers a lot simpler configuration and better compression. This should reduce the amount of code in encore and yield better results in production.

opened by thekonz 41
PHPStorm integration

PHPStorm can interpret standart Webpack config file but not the Encore webpack.config.js :

Can't analyse webpack.config.js: coding assistance will ignore module resolution rules in this file. Possible reasons: this file is not a valid webpack configuration file or its format is not currently supported by the IDE

I made this workaround to handle this : https://gist.github.com/plfort/93da0ee1465f1d7f929fe5d9e6307532

Do you have a better solution ?
docs

opened by plfort 36
How are static assets handled?

A question by @jrobeson on Symfony Slack:

So, with the manifest file approach for versioning, how are static assets handled? like referenced images that aren't in CSS.

I was previously using the hashed-asset-bundle, but you can't use the new manifest versioning with it.

Feature

opened by javiereguiluz 32
Added support for image optimiziation with image-webpack-loader
as discussed with @weaverryan here's a first POC for adding image optimization. Looking for general feedback as this is my first time working with Encore, so I'm not sure if my approaches make sense.

~~The method and feature name are kinda confusing due to the dependencies. We're using image-webpack-loader, which internally uses imagemin to optimize images. Not sure if stuff should be named after the loader (as of now), or rather something like enableImageOptimization() or name the feature imagemin instead of image-webpack…~~

To enable image optimization, install image-webpack-loader and call enableImagemin() in the Encore config. Further image configuration is available by passing options to the method exactly as in image-webpack-loader.

Encore.enableImagemin({ mozjpeg: { progressive: true, quality: 65 }, // optipng.enabled: false will disable optipng optipng: { enabled: false, }, pngquant: { quality: [0.65, 0.90], speed: 4 }, gifsicle: { interlaced: false, }, // the webp option will enable WEBP webp: { quality: 75 } });

#SymfonyHackday
opened by aschempp 26
Update Webpack to v5 (+ other dependencies)
Last week Webpack added a compat layer to its v5 alpha that allows the mini-css-extract-plugin to run on it (with deprecated messages). Since we include that plugin by default (and a lot of our tests relie on it) it was the main thing blocking us from preparing the migration.

I basically started from #564 which was updating some dependencies, enabling CSS HMR when needed and adding a configureMiniCssExtractPlugin(...) method, but with a few changes:

no more inconsistent hashes checks for the enableVersioning applies to js, css & manifest test: it seems to be working fine by default

no more embedding the webpack-manifest-plugin into our code: https://github.com/danethurber/webpack-manifest-plugin/issues/167 is still an issue but @mastilver has been working on the project lately (which is why the plugin works with Webpack 5) and a fix has already been merged on the next branch, so it's probably only a matter of time now :). Edit: Fixed in webpack-manifest-plugin@^3.0.0-rc

removal of Node 8 compatibility

So now, about the state of that PR:

0 failing test left:

~6 tests that will probably be fixed by https://github.com/webpack/webpack/pull/10661 in [email protected]: Uncaught Error: Error when running the browser: Error: Error when running the browser: ReferenceError: mod is not defined~

~All the 7 tests related to the vue-loader are failing with a Cannot find module 'webpack/lib/RuleSet error message (see: https://github.com/vuejs/vue-loader/issues/1599).~

~1 test related to the webpack-manifest-plugin issue previously mentioned~

~1 test related to createSharedEntry() which doesn't seem to work properly~

~1 test related to Babel that doesn't transform an arrow function as expected~

A lot of deprecation notices (but most, if not all, of them are triggered by vendors), for instance:

Compilation.hooks.normalModuleLoader was moved to NormalModule.getCompilationHooks(compilation).loader

Module.id: Use new ChunkGraph API

Module.updateHash: Use new ChunkGraph API

Chunk.modulesIterable: Use new ChunkGraph API

ChunkGroup.getModuleIndex2 was renamed to getModulePostOrderIndex

Compilation.chunks was changed from Array to Set (using Array method 'reduce' is deprecated)

chunk.files was changed from Array to Set (using Array method 'reduce' is deprecated)

Some modules do not declare they are compatible with Webpack 5 yet (warning messages during yarn install): this shouldn't be an issue unless those modules require a major version upgrade to be officialy compatible (in which case breaking changes could impact us).

We're still using webpack-cli@3 which may not support Webpack 5. It currently seems to be OK but we should probably upgrade to webpack-cli@4 (currently in beta). I took a quick glance at it and it probably won't be an easy thing to do, mainly because of how our "runtime context" works and how the new version of the CLI calls Webpack (through another process).
opened by Lyrkan 25
Question: why aren't we allowed to make multiple shared entries?

Hi,

Just today I noticed that in webpack-encore it's impossible to create two shared entries? For example I'd like to have one for my frontend and one for my backend because different scripts will be on each area of my app but they will still be reused through each app's respective area.

However in node_modules/@symfony/webpack-encore/lib/WebpackConfig.js:199

it's throwing an exception createSharedEntry() cannot be called multiple times: you can only create *one* shared entry.

If I disable that check it creates the two shared entries with different names normally and they seem to work OK. Is there a specific reason not to create multiple shared entries?

Thanks in advance.
Feature

opened by ioweb-gr 24

jQuery not exposed

I have problem with providing jQuery as var to global scope for legacy js code.

main.js

var $ = require('jquery');
window.$ = window.jQuery = $;

webpack-config.js

var Encore = require('@symfony/webpack-encore');

Encore
    // directory where all compiled assets will be stored
    .setOutputPath('mainsites/build/')

    // what's the public path to this directory (relative to your project's document root dir)
    .setPublicPath('/build')

    // empty the outputPath dir before each build
    .cleanupOutputBeforeBuild()

    // will output as web/build/app.js
    .addEntry('app', './assets/js/main.js')

    // allow legacy applications to use $/jQuery as a global variable
    .autoProvidejQuery()

    .enableSourceMaps(!Encore.isProduction())

    // create hashed filenames (e.g. app.abc123.css)
    .enableVersioning()
;

// export the final configuration
module.exports = Encore.getWebpackConfig();

package.js

{
  "name": "schoolm",
  "version": "0.0.1",
  "license": "UNLICENSED",
  "private": true,
  "dependencies": {
    "jquery": "^2.1.4",
  },
  "devDependencies": {
    "@symfony/webpack-encore": "github:symfony/webpack-encore"
  }
}

html

<?php
$webpackConfig = json_decode(file_get_contents(__DIR__ . '/../mainsites/build/manifest.json'), true);
?>
<script src="<?php echo $webpackConfig['build/app.js']; ?>"></script>

chrome console

> jQuery
VM117:1 Uncaught ReferenceError: jQuery is not defined
    at <anonymous>:1:1
(anonymous) @ VM117:1
> $
function ( selector, context ) {
		// The jQuery object is actually just the init constructor 'enhanced'
		// Need init if jQuery is called (just allow error to be thrown if not included)
		return new jQuery.…

opened by gimler 24

Bootstrap's modal.js + utile.js import
Hello team,

first of all, I want to thank you for having webpack-encore created. Webpack was a big issue for me but with Encore, everything seems to be easy to use. Very good job to y'all. Thank you again.

However, it seems like I have a trouble with Bootstrap's modal.js, its utile.js he is using and compilation with Webpack.

I'll try to make myself as clear as possible. Webpack and JavaScript are not exactly my thing and English is not my mother tongue, so, please, do tell me if you need any clarification or something.

In a first place, I tried to follow this tutorial about Bootstrap x Encore. But bootstrap-sass is no longer supported for bootstrap v4 as you can see in their readme and I'm working with bootstrap 4.1.1 ("bootstrap": "^4.1.1", from my package.json).

So, my webpack.config.js looks like this:

const Encore = require('@symfony/webpack-encore'); Encore … .addEntry( 'base', [ … 'bootstrap/js/dist/util.js', 'bootstrap/js/dist/modal.js', … ] ) … ;

It compils successfully as we can see here:

Running webpack ... DONE Compiled successfully in 6215ms 14:41:09 I 34 files written to web/built ✨ Done in 7.46s.

But when I try to open a modal on my website, I have this error: Uncaught ReferenceError: Util is not defined.

So I assume that the Util global variable that bootstrap is using is missing, since Webpack create functions around file it is importing and all.

So I added the following code in my webpack.conf.js:

.autoProvideVariables({ Util: 'bootstrap/js/dist/util.js', });

It works well for Popper (required to by Bootstrap) but not with Util since I have the same Uncaught ReferenceError: Util is not defined.

Soooo, after a few searches on GitHub and all, I found this comment.

I removed Util from both autoProvideVariables() and my addEntry(), modal.js as well to put them both in a bootstrap.js file:

const $ = require('jquery'); import Util from 'bootstrap/js/src/util' import Modal from 'bootstrap/js/src/modal'

and added an entry for it in webpack.config.js:

.addEntry('bootstrap', './assets/js/webpack/bootstrap.js')

And now, I have a error compilation:

ERROR Failed to compile with 1 errors 14:48:39 error in ./node_modules/bootstrap/js/src/modal.js Module parse failed: Unexpected token (222:8) You may need an appropriate loader to handle this file type. | _getConfig(config) { | config = { | ...Default, | ...config | } @ ./assets/js/webpack/bootstrap.js 3:0-43

So I tried to add babel following this documentation since it seems like it don't like the spread operator and it's not going well:

Running webpack ... Error: configureBabel() cannot be called because your app already has Babel conf iguration (a `.babelrc` file, `.babelrc.js` file or `babel` key in `package.json `). Either put all of your Babel configuration in that file, or delete it and us e this function.

So here I am, opening an issue, asking for help.

I don't know what can I do more. If anyone had the same issue I'd be glad to hear for a solution.

Thank you for your time.

Edit I tried this one but I still have a Uncaught TypeError: Util.getSelectorFromElement is not a function when I try to open my modal.
opened by CyrilKrylatov 23
Consider reverting #110

Versionning may be disabled at the user choice. Encore shouldn't ignore this choice to fix a technical naming issue.

For the final user, getting the bad file, may be better than no file at all (think about favicon.ico for instance). And IMO it shouldn't be a choice made be encore for you.

Please consider other alternatives like using the [path] when versioning is disabled or using a hash based on the filepath instead of the file content
docs

opened by jderusse 23

Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.

Hello, I tried to upgrade webpack-encore on a Symfony 5.3 project

I followed the doc well, and upgraded webpack-encore and stimulus. I also modified the controllers.json as shown.

But when I try the npm run dev command, I have the following error:

[webpack-cli] Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
 - configuration.module.rules[3].type should be one of these:
   "javascript/auto" | "javascript/dynamic" | "javascript/esm" | "json" | "webassembly/experimental"
   -> Module type to use for the module
 - configuration.output has an unknown property 'assetModuleFilename'. These properties are valid:
   object { auxiliaryComment?, chunkCallbackName?, chunkFilename?, chunkLoadTimeout?, crossOriginLoading?, devtoolFallbackModuleFilenameTemplate?, devtoolLineToLine?, devtoolModuleFilenameTemplate?, devtoolNamespace?, filename?, futureEmitAssets?, globalObject?, hashDigest?, hashDigestLength?, hashFunction?, hashSalt?, hotUpdateChunkFilename?, hotUpdateFunction?, hotUpdateMainFilename?, jsonpFunction?, jsonpScriptType?, library?, libraryExport?, libraryTarget?, path?, pathinfo?, publicPath?, sourceMapFilename?, sourcePrefix?, strictModuleExceptionHandling?, umdNamedDefine?, webassemblyModuleFilename? }
   -> Options affecting the output of the compilation. `output` options tell webpack how to write the compiled files to disk.

I tried modifying my webpack.config.js leaving only the bare minimum to see if it came from that. But the problem persists so I don't understand where it came from

Bug

opened by bastien70 22

Proposal to replace #504 (ESLint/Vue)
This PR add a second argument to Encore.enableEslintLoader() that is used to let the ESLint loader lint .vue files:

Encore.enableEslintLoader(() => {}, { lintVue: true });

Using lintVue won't add any ESLint configuration, that the job of the final user (see https://github.com/symfony/webpack-encore/pull/504#issuecomment-489221040).

EDIT:

While #657 is being discussed, you can use the following code to:

let ESLint process your .vue files

prevent the error Use the latest vue-eslint-parser., see #656

Encore.enableEslintLoader((options) => { delete options.parser; }, { lintVue: true });

EDIT 2:

PR #687 has been merged and issue #657 is now resolved. It means that you can use the following code to let eslint-loader handle .vue files:

Encore.enableEslintLoader(() => {}, { lintVue: true });
opened by Kocal 22
Added default fallback value for `enableBabelTypeScriptPreset`

The encore config wrapper does not have an optional/default argument fallback for enableBabelTypeScriptPreset and thus creates an invalid number of arguments notice when used without any while it does allow it in https://github.com/symfony/webpack-encore/blob/2e044a958dae6e6820aa99706642039ef8dd27cd/lib/WebpackConfig.js#L729

opened by jennevdmeer 1
Bump decode-uri-component from 0.2.0 to 0.2.2
Bumps decode-uri-component from 0.2.0 to 0.2.2.

Release notes

Sourced from decode-uri-component's releases.

v0.2.2

Prevent overwriting previously decoded tokens 980e0bf

https://github.com/SamVerschueren/decode-uri-component/compare/v0.2.1...v0.2.2

v0.2.1

Switch to GitHub workflows 76abc93

Fix issue where decode throws - fixes #6 746ca5d

Update license (#1) 486d7e2

Tidelift tasks a650457

Meta tweaks 66e1c28

https://github.com/SamVerschueren/decode-uri-component/compare/v0.2.0...v0.2.1

Commits

a0eea46 0.2.2

980e0bf Prevent overwriting previously decoded tokens

3c8a373 0.2.1

76abc93 Switch to GitHub workflows

746ca5d Fix issue where decode throws - fixes #6

486d7e2 Update license (#1)

a650457 Tidelift tasks

66e1c28 Meta tweaks

See full diff in compare view

Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

Dependabot commands and options

You can trigger Dependabot actions by commenting on this PR:

@dependabot rebase will rebase this PR

@dependabot recreate will recreate this PR, overwriting any edits that have been made to it

@dependabot merge will merge this PR after your CI passes on it

@dependabot squash and merge will squash and merge this PR after your CI passes on it

@dependabot cancel merge will cancel a previously requested merge and block automerging

@dependabot reopen will reopen this PR if it is closed

@dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually

@dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)

@dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)

@dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)

@dependabot use these labels will set the current labels as the default for future PRs for this repo and language

@dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language

@dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language

@dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

You can disable automated security fix PRs for this repo from the Security Alerts page.

dependencies
opened by dependabot[bot] 0

Encore.copyFiles() broken with NodeJS 18.12 (LTS)

When running Encore.copyFiles() with webpack-encore 4.1.2 using the new NodeJS LTS release (18.12), the following error is thrown:

Module build failed (from ./node_modules/@symfony/webpack-encore/lib/webpack/copy-files-loader.js):
Error: error:0308010C:digital envelope routines::unsupported
    at new Hash (node:internal/crypto/hash:71:19)
    at Object.createHash (node:crypto:133:10)
    at getHashDigest (/app/node_modules/loader-utils/lib/getHashDigest.js:46:34)
    at /app/node_modules/loader-utils/lib/interpolateName.js:113:11
    at String.replace (<anonymous>)
    at interpolateName (/app/node_modules/loader-utils/lib/interpolateName.js:110:8)
    at Object.loader (/app/node_modules/file-loader/dist/index.js:29:48)
    at Object.loader (/app/node_modules/@symfony/webpack-encore/lib/webpack/copy-files-loader.js:90:33)

Encore.copyFiles() internally uses https://github.com/webpack-contrib/file-loader, which was last released over 2 years ago and deprecated with webpack 5, so file-loader won't get any updates to be compatible to NodeJS 17 and above. The recommendation is to switch to webpack 5 asset modules.

As webpack-encore requires webpack ^5.72 in its peer dependencies, I would consider this a bug.

Bug

opened by nalxnet 1

[email protected]: Modern JS already guarantees Array#sort()

related issue: https://github.com/symfony/webpack-encore/issues/1144

I'm running @symfony/[email protected]

$ yarn upgrade
yarn upgrade v1.22.19
warning @symfony/webpack-encore > css-minimizer-webpack-plugin > cssnano > cssnano-preset-default > postcss-svgo > svgo > rn JS already guarantees Array#sort() is a stable sort, so this library is deprecated. See the compatibility table on MDN: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort#browser_compatibility

$ yarn why stable
yarn why v1.22.19
=> Found "[email protected]"
info Reasons this module exists
   - "@symfony#webpack-encore#css-minimizer-webpack-plugin#cssnano#cssnano-preset-default#postcss-svgo#svgo" depends on it
   - Hoisted from "@symfony#webpack-encore#css-minimizer-webpack-plugin#cssnano#cssnano-preset-default#postcss-svgo#svgo#stable"

This issue has been fixed downstream: https://github.com/svg/svgo/pull/1681

Can we somehow resolve this now? Or do we need to wait on one of our dependencies to update?

opened by arderyp 4

`enableBuildNotifications` should not be enabled by default

Why does default encore come with enableBuildNotifications on by default. Maybe it's my hate for notifications but In general I feel like things should not just install/run "random" binaries by default.

It comes from ..\encore-test\node_modules\node-notifier\vendor\snoreToast\snoretoast-x64.exe. And for me on windows it even created a shortcut in my start menu without any consent. While at the same time not removing it when I remove encore (or npm's node-notifier).

I feel like the consequences of that enabled should be clearly explained in the config and manually be enabled.

opened by jennevdmeer 2

Releases(v4.2.0)

v4.2.0(Dec 15, 2022)
Hey packagers!

This release allows webpack-cli version 5 to be used in your package.json file.

Upgrading

Run:

npm install "@symfony/webpack-encore@^4.2.0" --save-dev Or: yarn upgrade "@symfony/webpack-encore@^4.2.0"

Changes: v4.1.2..v4.2.0

Happy Packing!
Source code(tar.gz)
Source code(zip)
v4.1.2(Nov 21, 2022)
Hey packagers!

This release fixes an incompatibility when using @vue/compiler-sfc with Vue 2.7. Thanks to @dmaicher in #1166 for the fix!

Upgrading

Run:

npm install "@symfony/webpack-encore@^4.1.2" --save-dev Or: yarn upgrade "@symfony/webpack-encore@^4.1.2"

Changes: v4.1.1..v4.1.1

Happy Packing!
Source code(tar.gz)
Source code(zip)
v4.1.1(Oct 19, 2022)
Hey packagers!

A tiny release to fix a typo in 4.1.0 that made the package uninstallable.

Upgrading

Run:

npm install "@symfony/webpack-encore@^4.1.1" --save-dev Or: yarn upgrade "@symfony/webpack-encore@^4.1.1"

Changes: v4.1.0..v4.1.1

Happy Packing!
Source code(tar.gz)
Source code(zip)
v4.1.0(Oct 17, 2022)
Hey packagers!

This release adds first-class support for Svelte and fixes Vue 2 support, which was accidentally lost in version 4.0.

Upgrading

Run:

npm install "@symfony/webpack-encore@^4.1.0" --save-dev Or: yarn upgrade "@symfony/webpack-encore@^4.1.0"

Highlights

Features

Add support for Svelte - #781 thanks to @zairigimad

Bug Fixes

Support for Vue 2 was accidentally dropped in 4.0.0, and was re-added - #1157 thanks to @Kocal.

Changes: v4.0.0..v4.1.0

Happy Packing!
Source code(tar.gz)
Source code(zip)
v4.0.0(Sep 14, 2022)
Hey packagers!

This new major release is actually smaller and has an easy upgrade path. What changed? We have moved certain dependencies (like webpack itself) out of Encore and into your project. This means 2 things:

You'll need to install a few extra packages after upgrading (see notes below)

You can say goodbye to those "has unmet peer dependency" warnings!

This release also makes Encore compatible with Yarn Plug'n'Play and pnpm.

Upgrading

Run:

npm install "@symfony/webpack-encore@^4.0.0" webpack webpack-cli @babel/core @babel/preset-env --save-dev Or: yarn upgrade "@symfony/webpack-encore@^4.0.0" yarn add webpack webpack-cli @babel/core @babel/preset-env --dev

And note the following BC breaks:

The following dependencies must be added in your package.json: webpack webpack-cli @babel/core @babel/preset-env (#1142 and #1150):

npm install webpack webpack-cli @babel/core @babel/preset-env --save-dev # or via yarn yarn add webpack webpack-cli @babel/core @babel/preset-env --dev

The following dependencies must be removed from your package.json and Babel configuration: @babel/plugin-syntax-dynamic-import @babel/plugin-proposal-class-properties, since they are already included in @babel/preset-env (#1150):

npm remove @babel/plugin-syntax-dynamic-import @babel/plugin-proposal-class-properties # or via yarn yarn remove @babel/plugin-syntax-dynamic-import @babel/plugin-proposal-class-properties

and remove it from your Encore configuration:

Encore.configureBabel((options) => { - config.plugins.push('@babel/plugin-proposal-class-properties'); + })

Changes: v3.1.0..v4.0.0

Happy Packing!
Source code(tar.gz)
Source code(zip)
v3.1.0(Aug 24, 2022)
Hi Webpackers!

This is a tiny release that adds better support specifically for Vue 2.7.

To upgrade run:

yarn upgrade "@symfony/webpack-encore@^3.1.0"

Changes: v3.0.0..v3.1.0

Documentation: http://symfony.com/doc/current/frontend.html

Highlights:

Features

Add vue 2.7 feature to allow dropping vue-template-compiler - #1134 thanks to @billyct

Happy Packing!
Source code(tar.gz)
Source code(zip)
v3.0.0(Jul 8, 2022)
Hey packagers!

This new major release is actually quite smaller: including increasing the new Node minimum version from 12 to 14 and upgrading a few dependencies across major versions. Upgrading should be easy.

To upgrade run:

yarn upgrade "@symfony/webpack-encore@^3.0.0"

Changes: v2.1.0..v3.0.0

Documentation: http://symfony.com/doc/current/frontend.html

Highlights:

BC Breaks

In #1122 support for Node 12 was dropped.

In #1133, the following dependencies were bumped a major version:

css-minimizer-webpack-plugin 3.4 -> 4.0 (4.0 just drops Node 12 support)

less-loader 10 -> 11

postcss-loader 6 -> 7

sass-loader 12 -> 13

stylus 0.57 -> 0.58

stylus-loader 6 -> 7

If you're using any of these (all are optional except for css-minimizer-webpack-plugin and are extended them with custom configuration, check the CHANGELOG of each for any possible BC breaks).

Feature

#1133 - Increasing dependencies - @weaverryan

#1125 - Changing to support the "server" options object for webpack-dev-server - @weaverryan

#1122 - Allow sass-loader:^13.0.0, require node >= 14 - @jmsche

#1118 - Use cli param server-type to define devServer https mode - @thegillou

Happy Packing!
Source code(tar.gz)
Source code(zip)
v2.1.0(May 5, 2022)
Hey packagers!

This is a small releasing that adds the possibility to use the sass-embedded package with enableSassLoader(), which is a faster alternative to sass.

To upgrade run:

yarn upgrade "@symfony/webpack-encore@^2.1.0"

Changes: v2.0.0..v2.1.0

Documentation: http://symfony.com/doc/current/frontend.html

Highlights:

Feature

#1093 - Allow sass-embedded - @IonBazan

Source code(tar.gz)
Source code(zip)
v2.0.0(May 3, 2022)
Hi bundlers!

This is a new major release. In Encore itself, nothing really changed. However, we upgraded many of our dependencies across new major versions. Upgrading should be easy, unless you're integrating more deeply into any of the upgraded dependencies.

To upgrade run:

yarn upgrade "@symfony/webpack-encore@^2.0.0"

Changes: v1.8.2..v2.0.0

Documentation: http://symfony.com/doc/current/frontend.html

Highlights:

This is a new major version that contains several backwards-compatibility breaks.

BC Breaks

The following dependencies were upgraded a major version. It's unlikely these will cause problems, unless you were further configuring this part of Encore:

clean-webpack-plugin Version 3 to 4: dropped old Node & Webpack version support

css-loader Version 5 to 6: dropped old Node version support & CHANGELOG

css-minimizer-webpack-plugin Version 2 to 3: dropped old Node version support

loader-utils REMOVED

mini-css-extract-plugin Version 1.5 to 2.2.1: dropped old Node & Webpack version support & CHANGELOG

pretty-error Version 3.0 to 4.0: dropped old Node version support

resolve-url-loader Version 3.0 to 5.0: dropped old Node version support, requires postcss ^8.0, remove rework engine & CHANGELOG

style-loader Version 2 to 3: dropped old Node and Webpack version support & CHANGELOG

yargs-parser Version 20.2 to 21: dropped old Node version support

Additionally, Encore changed the supported versions of the following packages, which you may have installed to enable extra features:

eslint Minimum version increased from 7 to 8

eslint-webpack-plugin Minimum version increased from 2.5 to 3

fork-ts-checker-webpack-plugin Minimum version increased from 5 to 6 CHANGELOG

less-loader Minimum version increased from 7 to 10

postcss-loader Minimum version increased from 4 to 6

preact Minimum version increased from 8 to 10 CHANGELOG

sass-loader Minimum version increased from 9 to 12

stylus Minimum version increased from 0.54 to 0.56

stylus-loader Minimum version increased from 3 to 6 CHANGELOG

vue-loader Minimum version increased from 16 to 17 CHANGELOG

Removed Encore.enableEslintLoader(): use Encore.enableEslintPlugin().

If using enableEslintPlugin() with the @babel/eslint-parser parser, you may now need to create an external Babel configuration file. To see an example, temporarily delete your .eslintrc.js file and run Encore. The error will show you a Babel configuration file you can use.

With configureDefinePlugin(), the options['process.env'] key format passed to the callback has changed (see #960). If you are using configureDefinePlugin() to add more items to process.env, your code will need to change:

Encore.configureDefinePlugin((options) => { - options['process.env']['SOME_VAR'] = JSON.stringify('the value'); + options['process.env.SOME_VAR'] = JSON.stringify('the value'); })
Source code(tar.gz)
Source code(zip)
v1.8.2(Mar 17, 2022)
Hey Webpackers!

This release re-adds the --public option, which can be useful for the dev-server, especially with Docker. WIP docs can be found at: https://github.com/symfony/symfony-docs/pull/16622

To upgrade run:

yarn upgrade "@symfony/webpack-encore@^1.8.2"

Changes: v1.8.1..v1.8.2

Documentation: http://symfony.com/doc/current/frontend.html

Highlights:

Bug Fix

#1095 - bug #1095 Revert removing public option from dev-server - @louismariegaborit

Happy packing!
Source code(tar.gz)
Source code(zip)
v1.8.1(Jan 21, 2022)
Hey Webpackers!

This release fixes 1.8.0, which incorrectly requires the eslint-webpack-plugin package in all situations.

To upgrade run:

yarn upgrade "@symfony/webpack-encore@^1.8.1"

Changes: v1.8.0..v1.8.1

Documentation: http://symfony.com/doc/current/frontend.html

Highlights:

Bug Fix

#1076 - fix: lazy-load ESLint plugin dependency, fix #1075 - @Kocal

Happy packing!
Source code(tar.gz)
Source code(zip)
v1.8.0(Jan 21, 2022)
Hey Webpackers!

A new release with some nice features, provided by the community!

To upgrade run:

yarn upgrade "@symfony/webpack-encore@^1.8.0"

Changes: v1.7.1..v1.8.0

Documentation: http://symfony.com/doc/current/frontend.html

Highlights:

Feature

#985 - Move from eslint-loader to eslint-webpack-plugin - @Kocal

#1070 - New Encore method for adding multiple entries at once - @shmolf

#1074 - Support AVIF images - @benbankes

Happy packing!
Source code(tar.gz)
Source code(zip)
v1.7.1(Jan 21, 2022)
Hey Webpackers!

A tiny release that addresses a possible dependency issue with webpack-cli that can cause aa cryptic error. No fun!

To upgrade run:

yarn upgrade "@symfony/webpack-encore@^1.7.1"

Changes: v1.7.0..v1.7.1

Documentation: http://symfony.com/doc/current/frontend.html

Highlights:

Bug Fix

#1069 - Increased webpack-cli version constraint to v.4.9.1 - @nspyke

Happy packing!
Source code(tar.gz)
Source code(zip)
v1.7.0(Dec 2, 2021)
Hey Webpackers!

Yes! A new release! This small release adds support for Stimulus 3 (i.e. @hotwired/stimulus) and also fixes a minor bug when using the dev-server.

To upgrade run:

yarn upgrade "@symfony/webpack-encore@^1.7.0"

Changes: v1.6.1..v1.7.0

Documentation: http://symfony.com/doc/current/frontend.html

Highlights:

Dependency changes:

Official support for ts-loader 8 was dropped.

Official support for typescript 3 was dropped and minimum increased to 4.2.2.

Official support for vue was bumped to 3.2.14 or higher.

Official support for vue-loader was bumped to 16.7.0 or higher.

Feature

#1062 - Allowing @hotwired/stimulus, allowing @symfony/stimulus-bridge 3, dropping v1. - @weaverryan

Bug Fix

#1058 - Fix deprecated public option failure for webpack-dev-server - @atesca09

Happy packing!
Source code(tar.gz)
Source code(zip)
v1.6.1(Sep 3, 2021)
Hi Webpackers!

This release contains just one bug fix if you're using the webpack-dev-server

#1031 - changing position of host option for webpack-dev-server - @weaverryan

To upgrade run:

yarn upgrade "@symfony/webpack-encore@^1.6.1"

Changes: v1.6.0..v1.6.1

Documentation: http://symfony.com/doc/current/frontend.html

Happy packing!
Source code(tar.gz)
Source code(zip)
v1.6.0(Aug 31, 2021)
Hi Webpackers!

This release allows the latest less-loader and postcss-loader to be used:

Feature

#1008 - Allow postcss-loader 6 - @bobvandevijver

#1009 - Allow less-loader 10 - @bobvandevijver

To upgrade run:

yarn upgrade "@symfony/webpack-encore@^1.6.0"

Changes: v1.5.0..v1.6.0

Documentation: http://symfony.com/doc/current/frontend.html

Happy packing!
Source code(tar.gz)
Source code(zip)
v1.5.0(Jun 18, 2021)
Hi Webpackers!

This release allows the latest ts-loader and sass-loader to be installed.

Feature

#1000 - Allow ts-loader ^9.0.0, close #993 - @Kocal

#999 - Allow sass-loader ^12.0.0, close #996 - @Kocal

To upgrade run:

yarn upgrade "@symfony/webpack-encore@^1.5.0"

Changes: v1.4.0..v1.5.0

Documentation: http://symfony.com/doc/current/frontend.html

Happy packing!
Source code(tar.gz)
Source code(zip)
v1.4.0(May 31, 2021)
Hi Webpackers!

This release contains a bug fix if you're using Encore.enableBuildCache() and allows less-loader version 9. Thanks to @bobvandevijver for both of these - especially the bug fix, which was super tricky.

[FEATURE] Allow less-loader v9 - #983 thanks to @bobvandevijver

[BUG] Fix manifest key problem when using copy files - #936 thanks to @bobvandevijver

To upgrade run:

yarn upgrade "@symfony/webpack-encore@^1.4.0"

Changes: v1.3.0..v1.4.0

Documentation: http://symfony.com/doc/current/frontend.html

Happy packing!
Source code(tar.gz)
Source code(zip)
v1.3.0(May 11, 2021)
Hi Webpackers!

This release replaces an abandoned package friendly-errors-webpack-plugin with a fork of it @nuxt/friendly-errors-webpack-plugin. If you've been annoyed by warnings like "@symfony/webpack-encore > [email protected]" has incorrect peer dependency "webpack@^4.0.0"., then this release is for you!

[DEPENDENCY CHANGE] friendly-errors-webpack-plugin was replaced by @nuxt/friendly-errors-webpack-plugin - the previous package was abandoned. There should be no noticeable changes, unless you are using Encore.configureFriendlyErrorsPlugin() and happen to configure some feature that differs between these libraries (the new library is a fork of the old) To upgrade:

yarn upgrade "@symfony/webpack-encore@^1.3.0"

Changes: https://github.com/symfony/webpack-encore/compare/v1.2.0..v1.3.0

Documentation: http://symfony.com/doc/current/frontend.html

Happy packing!
Source code(tar.gz)
Source code(zip)
v1.2.0(May 3, 2021)
Hi Webpackers!

This release contains a major dependency upgrade (see details below) and a cool new .when() function that allows you to run conditional code.

[DEPENDENCY UPGRADE] css-minimizer-webpack-plugin was upgraded from version 1 to version 2. This should not affect you directly, unless you were passing custom options to this plugin (e.g. via configureCssMinimizerPlugin()). #966 thanks to @stof.

[FEATURE] Added Encore.when(), which can be used to easily add conditional code (e.g. code that should be run only in "dev"). See the index.js file for more details - #963 thanks to @Kocal.

[BUG] When using webpack-dev-server, if the target port (e.g. 8080) was unavailable, previously, a different port would be fine (e.g. 8081). This has now been disabled and you will get an error instead. This was done because there is no way for Encore to detect this change and update its config properly - #943 thanks to @weaverryan.

To upgrade:

yarn upgrade "@symfony/webpack-encore@^1.2.0"

Changes: https://github.com/symfony/webpack-encore/compare/v1.1.2..v1.2.0

Documentation: http://symfony.com/doc/current/frontend.html

Happy packing!
Source code(tar.gz)
Source code(zip)
v1.1.2(Mar 1, 2021)
Hi Webpackers!

This release fixes some bad behavior when using HMR with the dev-server. Previously, on any change (even those where the page should have been updated with HMR without a page refresh), the page would refresh. PR #939 fixes that by disabling auto-refresh. This means that your page will not refresh automatically after making a change. This was a trade-off, as HMR was unusable currently. Hopefully a future version of webpack-dev-server may address this.

Other PR's include:

minor #940 Clarify missing css file error message (thanks to @Gadgetdude)

bug #938 Require vue-loader 15.9.5 to work with Encore 1.0 (thanks to @weaverryan)

To upgrade:

yarn upgrade "@symfony/webpack-encore@^1.1.2"

Changes: https://github.com/symfony/webpack-encore/compare/v1.1.1..v1.1.2

Documentation: http://symfony.com/doc/current/frontend.html

Happy packing!
Source code(tar.gz)
Source code(zip)
v1.1.1(Feb 19, 2021)
Hi Webpackers!

This release fixes a bug that was introduced with Encore 1.0 and Webpack 5 related to copyFiles(). See #894 for the details.

The fix was done in #930 - a big thanks to @Lyrkan.

To upgrade:

yarn upgrade "@symfony/webpack-encore@^1.1.1"

Changes: https://github.com/symfony/webpack-encore/compare/v1.1.0..v1.1.1

Documentation: http://symfony.com/doc/current/frontend.html

Happy packing!
Source code(tar.gz)
Source code(zip)
v1.1.0(Feb 12, 2021)
Hi Webpackers!

This release allows you to use the newest version of 4 loaders without warnings:

Allow postcss-loader 5

Allow less-loader 8

Allow sass-loader 11

Allow stylus-loader 5

To upgrade:

yarn upgrade "@symfony/webpack-encore@^1.1.0"

Changes: https://github.com/symfony/webpack-encore/compare/v1.0.6..v1.1.0

Documentation: http://symfony.com/doc/current/frontend.html

Happy packing!
Source code(tar.gz)
Source code(zip)
v1.0.6(Feb 12, 2021)
Hi Webpackers!

This release fixes a problem the "keys" inside manifest.json for some images and fonts - see #907. This was fixed in #921.

If you continue to have any issues with your manifest.json file, please open an issue. We use a 3rd party library - webpack-manifest-plugin - and we've been working with them to smooth out their Webpack 5 compatibility.

To upgrade:

yarn upgrade "@symfony/webpack-encore@^1.0.6"

Changes: https://github.com/symfony/webpack-encore/compare/v1.0.5..v1.0.6

Documentation: http://symfony.com/doc/current/frontend.html

Happy packing!
Source code(tar.gz)
Source code(zip)
v1.0.5(Feb 6, 2021)
Hi Webpackers!

This release fixes a problem if you're using the dev-server mode with custom https configuration (like setting a pfx for the ssl certificate). See #903.

If you want to run the dev-server in https with some custom configuration, you should configure it entirely in webpack.config.js. For example, if you're using the Symfony binary and want to re-use its https certificate:

const path = require('path'); // ... .configureDevServerOptions(options => { options.https = { pfx: path.join(process.env.HOME, '.symfony/certs/default.p12'), } })

Then, do NOT pass the --https flag at the command line. Just run:

yarn dev-server

To upgrade:

yarn upgrade "@symfony/webpack-encore@^1.0.5"

Changes: v1.0.4..v1.0.5

Documentation: http://symfony.com/doc/current/frontend.html

Happy packing!
Source code(tar.gz)
Source code(zip)
v1.0.4(Feb 2, 2021)
Hi Webpackers!

This release fixes an incorrect warning if you're using @symfony/stimulus-bridge version 2. It also outputs a warning if you're using v1 of that library.

yarn upgrade "@symfony/webpack-encore@^1.0.4"

Changes: v1.0.3..v1.0.4

Documentation: http://symfony.com/doc/current/frontend.html

Happy packing!
Source code(tar.gz)
Source code(zip)
v1.0.3(Jan 31, 2021)
Hi Webpackers!

This release fixes a performance regression when using watch or dev-server. In both cases, every "re-build" would take as long as the original build. See #905 for the fix.

yarn upgrade "@symfony/webpack-encore@^1.0.3"

Changes: v1.0.2..v1.0.3

Documentation: http://symfony.com/doc/current/frontend.html

Happy packing!
Source code(tar.gz)
Source code(zip)
v1.0.2(Jan 29, 2021)
Hi Webpackers!

This release fixes a bug when using dev-server along with cleanOutputBeforeBuild(). The result would be that the manifest.json file would be missing from the output directory. That was fixed in #901.

yarn upgrade "@symfony/webpack-encore@^1.0.2"

Changes: v1.0.1..v1.0.2

Documentation: http://symfony.com/doc/current/frontend.html

Happy packing!
Source code(tar.gz)
Source code(zip)
v1.0.1(Jan 29, 2021)
Hi Webpackers!

This release fixes a bug related to version 4 of webpack-dev-server (which is included in version 1 of this library). The code still relied on several, removed options. See #899 for more details.

yarn upgrade "@symfony/webpack-encore@^1.0.1"

Changes: v1.0.0..v1.0.1

Documentation: http://symfony.com/doc/current/frontend.html

Happy packing!
Source code(tar.gz)
Source code(zip)
v1.0.0(Jan 27, 2021)
Hi Webpackers!

Today I'm thrilled to release Encore 1.0. In reality, Encore has been stable for years and has, as often as possible, deprecated features instead of hard breaking.

Most importantly, this release upgrades Webpack from 4 to 5, and a number of other dependencies have also been upgraded.

To upgrade run:

yarn upgrade "@symfony/webpack-encore@^1.0.0"

Changes: v0.33.0..v1.0.0

Documentation: http://symfony.com/doc/current/frontend.html

Highlights:

[DEPENDENCY UPGRADE] Webpack was upgraded from version 4 to 5.

[DEPENDENCY UPGRADES] The following packages had major version upgrades:

css-loader from 3 to 5

assets-webpack-plugin from 5 to 7

mini-css-extract-plugin from 0.4 to 1

style-loader from 1 to 2

terser-webpack-plugin from 1 to 5

webpack-cli from 3 to 4

webpack-manifest-plugin from 2 to 3

webpack-manifest-plugin from 3 to 4-beta

[DEPENDENCY SUPPORT CHANGES] Encore has changed what versions it supports of the following packages:

less from 3 to 4 and less-loader from 6 to 7

fork-ts-checker-webpack-plugin from 4 to 5 or 6

[BC BREAK] Image and font processing was changed from using file-loader (and optionally url-loader via configureUrlLoader()) to Webpack 5's new Asset Modules. In practice, unless you have a highly-configured system, this should not cause significant changes.

[BC BREAK] The configureUrlLoader() method was removed. See configureImageRule() and configureFontRule() - specifically the maxSize option and type: 'asset'. The url-loader is no longer used.

[BC BREAK] The disableImagesLoader() and disableFontsLoader() methods have been removed. See configureImageRule() and configureFontRule() for a new option to disable these.

[BC BREAK] The configureFilenames() method no longer accepts paths for images or fonts. See configureImageRule() and configureFontRule() for how to configure these filenames. The configureFilenames() method does now accept an assets option, but out-of-the-box, this will not result in any filename changes. See configureFilenames() for more details.

[BC BREAK] optimize-css-assets-webpack-plugin was replaced by css-minimizer-webpack-plugin and the optimizeCssPluginOptionsCallback() method was replaced by cssMinimizerPluginOptionsCallback().

[BC BREAK] The file-loader package is no longer required by Encore. If you use copyFiles(), you will need to install it manually (you will receive a clear error about this).

[BC BREAK] All previously-deprecated methods & options were removed.

[BEHAVIOR CHANGE] The HashedModuleIdsPlugin was previously used to help name "modules" when building for production. This has been removed and we now use Webpack's native optimization.moduleIds option, which is set to deterministic.

[configureMiniCssExtractPlugin()] configureMiniCssExtractPlugin() was added to allow the MiniCssExtractPlugin.loader and MiniCssExtractPlugin to be configured.

[enableBuildCache()] Added enableBuildCache() to enable the new Webpack 5 build caching. https://webpack.js.org/blog/2020-10-10-webpack-5-release/ This feature should be considered experimental.

Happy Webpacking!
Source code(tar.gz)
Source code(zip)