Webpack Encore utilisation des alias

Bonjour,

Dans des fichiers css, je cherche à utiliser un alias dans les fonctions url() pour indiquer le répertoire de certaines images qui se trouvent dans mon_projet/public/images.
Donc, dans webpack.conf.js, j'ai créé un alias @images comme ceci :

...
var path = require('path');
...
Encore
...
    .addAliases({'@images': path.resolve(__dirname, 'public/images')})
...
;
module.exports = Encore.getWebpackConfig();

Dans mon css, je cherche à accéder à une image de cette manière :

background-image: url('~@images/sprite.svg');

Or, de cette manière, l'image n'est pas affichée. Lorsque j'inspecte le css généré, j'ai ceci :

"background-image: url(/build/images/sprite.56e5c9c8.svg);"

Lorsque j'ouvre le fichier sprite.56e5c9c8.svg généré dans /build/images/, j'ai ceci :

module.exports = __webpack_public_path__ + "_/public/images/sprite.e9a8abfa.svg";

Quelqu'un aurait une idée sur l'origine du fait que mon image ne s'affiche pas?

Merci d'avance pour votre aide.

Salut

dans ton manifest.json tu as la référence de ton image ?

genre un truc comme ça :

{
  ...
  "build/images/noSpam.png": "/build/images/noSpam.d47c971d.png",
  ...
}

Par contre SVG je sais pas comment ça se passe si c'est le même principe que png..

Salut,

Merci beaucoup pour ton aide.

Lorsque je regarde dans le manifest.json, je n'ai effectivement pas la référence à mon image.

Concernant le format svg, je ne le maîtrise pas non plus : c'est le webdesigner avec qui je collabore qui maîtrise cela. Cependant, si je mets l'url complète pour accéder à l'image :

background-image: url('http://127.0.0.1:8000/images/sprite.svg');

elle s'affiche bien. Mais c'est impossible à utiliser en production