使用cdn引入情况下，svg图标加载失败

[FeiFanLiang]

attributeChangedCallback (name, oldValue, newValue) {
        if( name == 'name' && this.use){
            this.use.setAttributeNS('http://www.w3.org/1999/xlink', 'xlink:href', `../iconfont/icon.svg#icon-${newValue}`);
        }
        if( name == 'path' && this.d){
            this.d.setAttribute("d", newValue);
        }
        if( name == 'color' && this.icon){
            this.icon.style.color = newValue;
        }
        if( name == 'size' && this.icon){
            this.icon.style.fontSize = newValue + 'px';
        }
    }
}
../iconfont路径是本地路径
网络请求svg路径url为 file:///F:/%E6%96%B0%E5%BB%BA%E6%96%87%E4%BB%B6%E5%A4%B9/iconfont/icon.svg

[XboxYan]

建议把图标库放在本地，同时注意路径是否正确。

推荐使用其他方式引入组件库。

[Forever17s]

@XboxYan 你好，我的项目在作为npm包导出后，在使用icon时那个svg读取不到。使用一个vue项目通过npm的方式引你这个xy-icon标签发现也是有问题的。

所以想跟题主一样，将svg放到服务端再引入，结果发现引不进来。请问还有什么好的办法吗

[xiaopc]

若使用模块打包器并将 xy-ui 作为组件引入，手动修改 node-modules 下的 xy-icon.js

1. 在最前面加上 import sprite from '../iconfont/icon.svg';

2. 修改
   

   xy-ui/components/xy-icon.js

   Line 90 in d287472

   this.use.setAttributeNS('http://www.w3.org/1999/xlink', 'xlink:href', `../iconfont/icon.svg#icon-${newValue}`);

   
   把 ../iconfont/icon.svg 改为 ${sprite}

暂时没找到兼容浏览器 modules 引入的方法（浏览器下 MIME type 非 javascript 无法加载，而模块打包器不处理 stage 3 动态加载）