這是花褲衩在掘金上發布的關於這個優雅的使用icon的過程
這是關於如何自己封裝乙個元件上傳npm庫
久在vue後台管理系統混跡的童鞋應該知道花褲衩
的吧,我用了他的vue-admin-template
模板,順便學習了一下大佬的**,裡面有乙個使用svg-icon
的元件,認真看了下,因為我一般用的都是阿里爸爸iconfont
官方的那種使用方式,都知道的,看人家模板是怎麼用的,原理去大佬掘金的文章上看:
首先寫乙個svg-icon
元件:
import vue from 'vue'
import svgicon from '@/components/svgicon'// svg component
// register globally
vue.component('svg-icon', svgicon)
const req = require.context('./svg', false, /\.svg$/) // 這裡./svg是存放你的svg格式的icon的資料夾
const requireall = requirecontext => requirecontext.keys().map(requirecontext)
requireall(req)
然後使用:
// 這個icon-class="man",man就是你要用的svg的名字
手摸手,帶你實現移動端H5瀑布流布局
移動端瀑布流布局是一種比較流行的網頁布局方式,視覺上來看就是一種像瀑布一樣垂直落下的排版。每張並不是顯示的正正方方的,而是有的長有的短,呈現出一種不規則的形狀。但是它們的寬度通常都是相同的 因為移動端瀑布流布局主要為豎向瀑布流,因此本文所 的是豎向瀑布流 豎向瀑布流布局主要有下面幾種特點 不同於傳統...
手摸手教你如何使用npm發布vue外掛程式
有兩種方式 build lib vue cli service build target lib name image ipreview dest lib src index.js 下面介紹下命令中的幾個部分。target lib target有好幾個選項。這裡是打包成乙個庫 lib 發布外掛程式的...
icon在專案中的使用
將icons資料夾放在src目錄下方 svg資料夾裡面都是一些svg檔案 index.js裡面則是配備的前端工程化js檔案 import vue from vue import svgicon from c svgicon vue.component svg icon svgicon const r...