symfony 4 webpack + encore handle image in template more info

Question

Like this question:

Using Symfony 4 with Webpack + Encore + Yarn, I want to handle images in my templates, and I am not really how to achieve this.

<

Answer 1

I've found a good solution to handle the images or other files into the template.

Here -> https://knpuniversity.com/screencast/webpack-encore/copy-plugin

Step 1: Install the plugin

yarn add copy-webpack-plugin --dev

Step 2: Config the webpack.config.js

var Encore = require('@symfony/webpack-encore');
const CopyWebpackPlugin = require('copy-webpack-plugin');

Step 3: Tell webpack where is your folder (example here static, can be img or anything)

.addPlugin(new CopyWebpackPlugin([
        // copies to {output}/static
        { from: './assets/static', to: 'static' }
]))

Step 4: run encore

yarn run encore dev

All your folders and files into "static" (for the example) will be copy into the "Public/build" folder!!!

Voilà voilà