今天想導出svg格式的圖片支持webFont，結果AI打不開了，文件好像損壞了，於是就想辦法在PS里面導出。
網上搜索到一篇文章，騰訊的 http://isux.tencent.com/ps-photoshop-cc-fd.html，
同時還會引用到一個三方腳本 http://hackingui.com/design/export-photoshop-layer-to-svg/ ，
三方腳本的一篇文章 http://www.ui.cn/detail/53284.html。
最終找到了解決辦法，最終實現的效果是：修改圖層名為xx.png xx.svg等格式會自動導出切圖，導出的svg支持icomoon。
我的PS cc支持，PS cc 以下版本不確定，可以先看看本地的PS文件夾里有沒有下圖的這些文件
以下是騰訊那篇文章的部分引用，也是我們必須要操作的步驟：
自動切圖（含WebP、SVG格式）：
前端開發人員經常需要將很多圖層切出成獨立的圖片。有了自動切圖功能，無需花更多時間來切圖了。只需在圖層名后添加相應格式后綴（如.png)，即可自動輸出所需格式的圖片。
- 請保持菜單“編輯->首選項->增效工具”中的“生成器”為啟用狀態；
- 依次點擊菜單“文件->生成->圖像資源”，確認該菜單項已被勾選；
試着修改某個圖層命名(如 iTunes.png)，然后檢查當前 psd 文件所在目錄下的“文件名-assets” 的目錄，打開此目錄，發現 iTunes.png 已經躺在里面了。
常用技巧：
- @2x Retina 圖片的輸出，在圖層前添加 200% 即可，如 200% logo@2x.png ;
- 開啟 WebP、SVG 格式的自動輸出： 新建 generator.json 文件，內容如下：
{ "generator-assets": { "svg-enabled": true, "webp-enabled": true } }將此配置文件拷貝至： Windows: (Win+R后輸入 %USERPROFILE% )目錄下，如 C:\Users\xxx Mac OS: $HOME 如“Macintosh HD>Users>xxx” 目錄下 WebP 輸出暫只支持 Mac OS。
上面這個地址在windows，我的電腦里是這樣的：
↑ 以上僅僅是支持了自動切圖 。
以下是另一篇文章的引用，這里將腳本引入到PS，使能夠導出正確的svg文件：
將PS圖層轉換成SVG文件的免費腳本【小工具分享】
發現一款將PS圖層轉換成SVG的小腳本，分享給大家！免費的哦
關於什么是SVG 請自行百度。
下面簡單說一下小工具的使用：
1.新建文檔
2.畫出形狀（位圖 矢量圖 智能對象）都可以
3.將圖層命名為“文件名.svg”（一定要改后綴）。保存文檔
4.文件--腳本--瀏覽--找到腳本 即可生成
5.生成的文件保存在你的源文件存儲的位置
注：1.我使用的版本是是PS CC 和 2014（PC和MAC都試過），CS6之前的版本沒有試過
2.選擇多個圖層導出也可以
3.當然，你也可以把腳本復制到PS的安裝目錄，方便以后使用
4.有些朋友反映生成出來的只有.AI，沒有.svg，如果這樣的話請將自己電腦里面的AI升級一下再試
5.如果還不行的話，PS 2014里面有個“抽出資源”，也是可以生成svg的，只是這個腳本方便一些，看自己中意
4.生成的文件有兩個（.ai和.svg） 請根據需求取舍
以上步驟，已經實現了修改圖層名后綴 自動保存為相應格式
下面是iconmoon里遇到的問題：
svg在頁面上能顯示，但我把svg導入到icomoon里，發現是空的
用編輯器打開自動導出的svg和之前設計師轉換過的svg對比：
（1）這是PS自動導出的svg
（2）這是在icomoon里可以使用的設計師轉換過的svg
這個<g>標簽應該是不影響的，應該是svg標簽里，這段屬性
把這段屬性粘貼到PS導出的svg里，保存再導入到icomoon里，成功了，那么現在需要去修改ps文件夾里的腳本，把這段屬性給加上。
打開三方下載的save-ps-to-svg1.0.jsx，發現里面沒有svg的標簽配置，那可能這個配置是PS自帶的，在找配置文件遇到了一些坑，
不過最后還是成功找到了正確的文件
.jsx文件其實就是用javascript寫的，Generator-builtin這個目錄里你還會發現有node_module。
打開getLayerSVG，修改代碼如下（修改代碼要看仔細避免出錯），寬高可以自己定，但是viewBox和enable-background的值也要相應改動
OK，現在修改形狀圖層后綴為.svg就可以支持iconmoon了。（目測只支持形狀）
但是還有一個問題：我們如果修改為.png，導出的 圖片大小 為 圖層 圖形 的大小（符合切圖的需求），
而svg不一樣，我們現在設置的寬高是20px，在PS上，它會從畫布的左上角來保存圖片，如圖，我們必須得把.svg圖層放到正方形方框內
這個問題我還沒有解決，因為這或許還得改ps腳本文件里的代碼，但是我確實不知道改哪里。
現在有兩個辦法：
第一個是新建並保存一個psd文件（必須保存psd，svg導出目錄是根據psd文件所在位置定的），
把寬高設置成getLayerSVG配置文件里的寬高，然后把需要轉換成svg的圖層都放進來自動導出。
第二個辦法就是在原psd里面，把.svg圖層移動到上圖紅色方框的位置再保存。
作為一個前端是很少切圖的，這樣能提高我的效率，就算是設計師，也許用到這種方法也可以提高效率，如果你不是
設計師，那你就用這招去討好公司的設計師妹紙吧，23333333333~
如果在操作中出現問題，可以留言給我。
注意： 形狀一定要撐滿整個畫布，否則有空隙的話，在網頁中，居中什么的就會出現問題，特別是字體設置比較大的時候就特別明顯