Configuring Babel
Edit this pageWarning: You are browsing the documentation for Symfony 4.0, which is no longer maintained.
Read the updated version of this page for Symfony 6.1 (the current stable version).
Configuring Babel
Babel is automatically configured for all .js and .jsx files via the
babel-loader with sensible defaults (e.g. with the env preset and
react if requested).
Need to extend the Babel configuration further? The easiest way is via
configureBabel():
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16
// webpack.config.js
// ...
Encore
// ...
// first, install any presets you want to use (e.g. yarn add babel-preset-es2017)
// then, modify the default Babel configuration
.configureBabel(function(babelConfig) {
// add additional presets
babelConfig.presets.push('es2017');
// no plugins are added by default, but you can add some
// babelConfig.plugins.push('styled-jsx/babel');
})
;Creating a .babelrc File
Instead of calling configureBabel(), you could create a .babelrc file
at the root of your project. This is a more "standard" way of configuring
Babel, but it has a downside: as soon as a .babelrc file is present,
Encore can no longer add any Babel configuration for you. For example,
if you call Encore.enableReactPreset(), the react preset will not
automatically be added to Babel: you must add it yourself in .babelrc.
An example .babelrc file might look like this:
1 2 3 4 5 6 7 8 9 10 11 12
{
presets: [
['env', {
modules: false,
targets: {
browsers: '> 1%',
uglify: true
},
useBuiltIns: true
}]
]
}
