在我的Vue工程中有一個元件
<md-bottom-bar-item v-for="tab in tabs"
:id="tab.id"
md-icon-src="../assets/icon/ic_home_black_48px.svg"
:md-active='tab.active'>{{ tab.title }}
</md-bottom-bar-item>
但是npm run build的時候,md-icon-src沒有被轉換成打包後的路徑。
但查看webpack.base.conf.js裡是支援svg的
{
test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
loader: 'url-loader',
options: {
limit: 10000,
name: utils.assetsPath('img/[name].[hash:7].[ext]')
}
},
請問這是因為md-icon-src是自訂屬性的原因嗎?該如何解決。
你還需要在 webpack 中為 vue-loader 設定 transformToRequire,為之加上 md-bottom-bar-item 元素的 md-icon-src 屬性必須轉換為 require。
請參閱:http://vue-loader.vuejs.org/e...
或參與此講座:/l/15...,6.5 折限時優惠中。
還有一個想法是在 script 裡 require svg 檔案給元件實例數據,然後在 md-icon-src 上綁定該數據。