Base64 encode on vendors

sage
1

Hello everyone, I have problem with Leaflet during compress of all assets yarn build:production, Leaflet marker images are encoded into Base64. It seems like Sage encodes empty string, because at the end of base64 code there is “marker-icon.png”, Is there are any options to solve this problem or bypass it?

2

Hey @Sid,

I believe that’s handled by url-loader. Here’s the relevant bit from webpack.config.js:

{
  test: /\.(ttf|otf|eot|woff2?|png|jpe?g|gif|svg|ico)$/,
  include: config.paths.assets,
  loader: "url",
  options: {
    limit: 4096,
    name: `[path]${assetsFilenames}.[ext]`,
  },
},
{
  test: /\.(ttf|otf|eot|woff2?|png|jpe?g|gif|svg|ico)$/,
  include: /node_modules/,
  loader: "url",
  options: {
    limit: 4096,
    outputPath: "vendor/",
    name: `${config.cacheBusting}.[ext]`,
  },
},

The limit options mean that files under 4,096 bytes will be encoded and inlined.

Hope that gets you started on the right troubleshooting path–I would look around online for other folks using Leaflet with webpack / url-loader and see if you can find someone who has solved this problem already. E.g., maybe this is related? https://github.com/Leaflet/Leaflet/issues/4968#issuecomment-254018065

2 Likes