javascript - vue如何在HTML引入svg文件

Question

在網路上看可以用object元素，但是報404，路徑確定沒錯。

程式碼：

#

Answer 1

檢查這個：
https://stackoverflow.com/que...

Answer 2

既然資源是svg, 那麼最好是使用svg標籤去引用, 這樣可以對svg調整大小, 設定填充色等一系列的svg特性都可以使用。

具體怎麼引用要看使用什麼loader了:

html:

    <use xmlns:xlink="http://www.w3.org/1999/xlink" :xlink:href="require('../svg/icon-header.svg')"></use>

webpack:

    {
        test: /\.svg$/,
        loader: 'svg-sprite?' + JSON.stringify({
            name: '[name]_[hash]',
            prefixize: true
        })
    }

loader網址: https://github.com/kisenka/svg-sprite-loader
可以詳細查看API。

Answer 3

如果作為圖片使用的話，可以直接作為背景用
background-image: url('../../../static/icons/site.svg');