Skip to content

Instantly share code, notes, and snippets.

@mehigh
Created August 5, 2020 14:10
Show Gist options
  • Save mehigh/e6844eb473883fe15e81a2f1014c2034 to your computer and use it in GitHub Desktop.
Save mehigh/e6844eb473883fe15e81a2f1014c2034 to your computer and use it in GitHub Desktop.
WordPress Webpack Config based on Encore
var Encore = require('@symfony/webpack-encore');
// Manually configure the runtime environment if not already configured yet by the "encore" command.
// It's useful when you use tools that rely on webpack.config.js file.
if (!Encore.isRuntimeEnvironmentConfigured()) {
Encore.configureRuntimeEnvironment(process.env.NODE_ENV || 'dev');
}
Encore
// directory where compiled assets will be stored
.setOutputPath('assets/dist')
// public path used by the web server to access the output path
.setPublicPath( '/wp-content/themes/stirling/assets/dist/' )
// only needed for CDN's or sub-directory deploy
.setManifestKeyPrefix('')
/*
* ENTRY CONFIG
*
* Add 1 entry for each "page" of your app
* (including one that's included on every page - e.g. "app")
*
* Each entry will result in one JavaScript file (e.g. app.js)
* and one CSS file (e.g. app.css) if your JavaScript imports CSS.
*/
.addEntry( 'stirling', './assets/src/js/stirling.js')
.addEntry( 'skip-link-focus', './assets/src/js/skip-link-focus-fix.js')
.addEntry( 'print-friendly', './assets/src/js/print-friendly.js')
.addEntry( 'pigeon', './assets/src/js/pigeon.js')
// When enabled, Webpack "splits" your files into smaller pieces for greater optimization.
.splitEntryChunks()
// will not require an extra script tag for runtime.js
.disableSingleRuntimeChunk()
/*
* FEATURE CONFIG
*
* Enable & configure other features below. For a full
* list of features, see:
* https://symfony.com/doc/current/frontend.html#adding-more-features
*/
.cleanupOutputBeforeBuild()
.enableBuildNotifications()
.enableSourceMaps( !Encore.isProduction() )
// enables hashed filenames (e.g. app.abc123.css)
.enableVersioning(Encore.isProduction())
// enables @babel/preset-env polyfills
.configureBabel( () => {}, {
useBuiltIns: 'entry',
corejs: 3
} )
// enables Sass/SCSS support
.enableSassLoader()
;
module.exports = Encore.getWebpackConfig();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment