You can't use the SVG tag directly with lightning components. You'll need to make a custom component for rendering SVGs. You can copy/paste this code from the Lightning Design System Site to make your own custom SVG component: https://www.lightningdesignsystem.com/resources/lightning-svg-icon-component-helper/
You'll need to use that component instead of the SVG tag.



https://salesforce.stackexchange.com/questions/108710/failed-to-save-undefined-no-component-named-markup-svg-found/163178


create a component as "sv.cmp" with below code after that save your coe


svg.cmp
 

<aura:component>
    <aura:attribute name="svgPath" default="" type="String" description="the path for the icon in the static resource, this will be use in a SVG use tag" />
    <aura:attribute name="name" default="" type="String" description="Symbol name of icon" />
    <aura:attribute name="class" default="" type="String" description="the class of this SVG tag, can be use for CSS purpose" />
    <aura:attribute name="containerClass" default="" type="String" description="Container class name for span container of icon" />
    <aura:attribute name="category" default="" type="String" description="Category of icon- action, standard, utility etc." />
    <aura:attribute name="size" default="" type="String" description="Size of icon-- small, medium, large" />
    <aura:attribute name="assistiveText" default="" type="String" description="Description name of icon" />
    <span aura:id="container" class="{!v.containerClass}">
        <span aura:id="assistiveText" class="slds-assistive-text">{!v.assistiveText}</span>
    </span>
</aura:component>

helper.js

({
    renderIcon: function(component) {
        var prefix = "slds-";
        var svgns = "http://www.w3.org/2000/svg";
        var xlinkns = "http://www.w3.org/1999/xlink";
        var size = component.get("v.size");
        var name = component.get("v.name");
        var classname = component.get("v.class");
        var category = component.get("v.category");
 
        var containerClassName = [
            prefix+"icon__container",
            prefix+"icon-"+category+"-"+name,
            classname
        ].join(' ');
        var iconClassName = prefix+"icon "+prefix+"icon--" + size;
        component.set("v.containerClass", containerClassName);
 
        var svgroot = document.createElementNS(svgns, "svg");
        svgroot.setAttribute("aria-hidden", "true");
        svgroot.setAttribute("class", iconClassName);
        svgroot.setAttribute("name", name);
 
        // Add an "href" attribute (using the "xlink" namespace)
        var shape = document.createElementNS(svgns, "use");
        shape.setAttributeNS(xlinkns, "href", component.get("v.svgPath"));
        svgroot.appendChild(shape);
 
        var container = component.find("container").getElement();
        container.insertBefore(svgroot, container.firstChild);
    }
})

render.js
 

({
    render: function(component, helper) {
        // By default, after the component finished loading data/handling events,
        // it will call this render function this.superRender() will call the
        // render function in the parent component.
        var ret = this.superRender();
 
        // Calls the helper function to append the SVG icon
        helper.renderIcon(component);
        return ret;
    }
})