Skip to content

Style sheets referenced in XML or SVG #6835

Description

@bbehling-trimble

Is this a bug report?

Maybe?

I'm trying to use an SVG which references an external CSS file. When the browser requests the external style sheet, create-react is redirecting the request to the index page with a status of 304.

This does work correctly if I us an absolute path in the SVG, but a relative path is changed to /static/media/svg_style.css

Do I have an incorrect relative path in the SVG, or is this a bug?

<?xml-stylesheet type="text/css" href="../public/svg_style.css" ?>
<svg  xmlns="http://www.w3.org/2000/svg" viewBox="0 0 841.9 595.3">
    <g class='svgTestFill'>
        <path  d="M666.3 296.5c0-32.5-40.7-63.3-103.1-82.4 14.4-63.6 8-114.2-20.2-130.4-6.5-3.8-14.1-5.6-22.4-5.6v22.3c4.6 0..."/>
        <circle  cx="420.9" cy="296.5" r="45.7"/>
        <path   d="M520.5 78.1z"/>
    </g>
</svg>

This also works if I bring in the SVG as

import {ReactComponent as Logo }from './logo.svg';

but I'd like to know if it's possible to load css from the SVG without having to load the SVG as a react component.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions