在現代Web開發中，SVG（可縮放矢量圖形）因其清晰度高、文件體積小和可編程性強的特點而被廣泛使用。很多開發者最初會将SVG代碼直接嵌入HTML中，但随着項目規模擴大，将SVG遷移到獨立文件成爲更好的選擇。本文将詳細介紹如何将HTML中的SVG代碼遷移到單獨的.svg文件。

爲什麽要遷移SVG到獨立文件

1.代碼整潔性：減少HTML文件的體積和複雜度

2.可維護性：集中管理所有SVG資源

3.可複用性：同一SVG可在多個頁面使用

4.緩存優勢：浏覽器可單獨緩存SVG文件

5.性能優化：減少HTML文檔大小，加快初始加載

如何操作

• 菜單欄：配置選項 > 代碼轉換 > 頁面的SVG代碼轉換圖片文件(默認不勾選)

測試

• 原始代碼：html代碼中的svg圖片

• 輸出代碼：已經将svg代碼平移到svg單獨圖片文件後的代碼

支持

• 自動修複svg文件中的viewBox屬性
• 自動添加svg文件中的xmlns空間
• 原代碼中的style和class平移到img屬性
• 支持svg的use元素解析
• 自動修複svg文件中的大小寫問題