vue3 版本引入本地含svg的iconfont报错

[akFace]

相关平台

微信小程序

复现仓库

使用的是nutui-taro模板

小程序基础库: 2.28.0 使用框架: Vue 3

复现步骤

我这里按照了这样的方式引入https://nutui.jd.com/#/zh-CN/component/icon

run的时候报了这样的警告

⚠️ Warinings:

ModuleWarning: Module Warning (from ./node_modules/_postcss-loader@6.2.1@postcss-loader/dist/cjs.js):
Warning

(3:3) postcss-url: Image type is svg and link contains #. Postcss-url cant handle svg fragments. SVG file fully inlined. F:\Code\micro-front\src\assets\iconfont\iconfont.svg

期望结果

修复问题

实际结果

报错了

环境信息

👽 Taro v3.5.7

  Taro CLI 3.5.7 environment info:
    System:
      OS: Windows 10
    Binaries:
      Node: 16.17.0 - C:\Program Files\nodejs\node.EXE
      Yarn: 1.22.18 - ~\AppData\Roaming\npm\yarn.CMD
      npm: 8.15.0 - C:\Program Files\nodejs\npm.CMD

[Chen-jj]

麻烦提供一下 demo，看着是 postcss-url 插件对 svg 的支持问题，也可以从这个方向先调查下

[akFace]

demo在这 https://github.com/akFace/taro-nutui-demo-test

[zybieku]

把svg这行删掉即可 ,你 iconfont里面也用不到这个svg

[akFace]

把svg这行删掉即可 ,你 iconfont里面也用不到这个svg

删掉图标显示不出了 😭

[yoyo837]

你在iconfont生成时就不要选svg呗.

[yoyo837]

不勾选svg生成结果试试

[akFace]

这个可以，牛皮 ，多谢了

[akFace]

不勾选svg生成结果试试

OK了，多谢

[Zhou-Bill]

还有其他解决方案吗？

[yoyo837]

还有其他解决方案吗？

我把这个Reopen先吧, 上面说的去掉SVG可能只是临时方案... 看大佬们怎么说.

[Zhou-Bill]

我看postcss-url 有这个设置，但我不知道taro该怎么设置

[yoyo837]

有兴趣的话可以研究一下, 来个PR什么的.

[XXLWHO]

这样不会发出警告了

[Gcalolin]

我发现配置过滤掉具体的svg路径也能解决