Skip to content

Ensure SVGs are properly compiled

Paul Gascou-Vaillancourt requested to merge 432742-fix-svg-imports into master

What does this MR do and why?

Ensure SVGs are properly compiled

Tweaks Webpack config to ensure that SVGs imported with the raw resource query go through the raw-loader while any other SVG import goes through file-loader. This should fix an issue where some SVGS were being rendered as plain paths.

Changelog: fixed

MR acceptance checklist

Please evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.

Screenshots or screen recordings

Examples of previously broken SVGs:

Before After
Vulnerability list issue link Screenshot_2024-01-10_at_4.22.59_PM Screenshot_2024-01-10_at_4.22.06_PM
Work item details modal empty state Screenshot_2024-01-10_at_4.27.51_PM Screenshot_2024-01-10_at_4.27.04_PM

How to set up and validate locally

  1. IMPORTANT: If you are using Vite, make sure to switch back to Webpack to verify this fix: https://gitlab.com/gitlab-org/gitlab-development-kit/-/blob/main/doc/configuration.md#vite-settings
  2. Check that SVGs are rendered properly.

Related to #432742 (closed)

Edited by Paul Gascou-Vaillancourt

Merge request reports