前言
abp無疑是目前net程序員中最火最好的免費開源框架之一了。在實際開發(fā)應(yīng)用中，經(jīng)常要用到的一個功能是所見即所得的在線編輯器，summernote就是一個免費、簡潔的開源的編輯器。而abp默認并沒有給我們集成進來，比如我開發(fā)的新聞模塊，就需要集成summernote編輯器，下面我介紹一下集成的過程
基本集成過程
1、從https://aspnetboilerplate.com/Templates下載最新的代碼，我用的是asp.net core 多頁面版本
2、下載完成后，打開解決方案，打開Web.Mvc項目根目錄下的libman.json，增加一行：
{
"library": "summernote@0.8.18",
"destination": "wwwroot/libs/summernote"
}
然后右鍵選擇libman.json文件，選擇還原客戶端
3、在views/share/layout/_Scripts.cshtml中添加summernote相應(yīng)的js
@*summernote scripts start*@
<script src="~/libs/summernote/dist/summernote.js"></script>
<script src="~/libs/summernote/dist/lang/summernote-zh-CN.js"></script>
<script src="~/libs/summernote/dist/plugin/files/summernote-file.js"></script>
@*summernote scripts end*@
4、在views/share/layout/_Styles.cshtml中添加summernote相應(yīng)的css
<link href="~/libs/summernote/summernote.css" rel="stylesheet" asp-append-version="true" />
這樣就在全局中配置好了summernote,在需要使用的地方引入就可以了。
比如界面上：
<textarea id="summernote" name="NewsContent"></textarea>
后臺js代碼
$('#summernote').summernote();
基本的界面如圖：
默認summernote功能的不足
summernote 默認的功能插入圖片是保存圖片為base64格式，如果插入的圖片很多很大，保存到數(shù)據(jù)庫的話內(nèi)容一多，數(shù)據(jù)庫壓力很大，而且默認沒有上傳附件文件的功能，在實際開發(fā)中，必須擴展這些功能，把圖片、音視頻文件、word、pdf,壓縮文件上傳到服務(wù)器并存成文件，數(shù)據(jù)庫中中保留文件的名稱和路徑，這樣數(shù)據(jù)庫調(diào)用起來速度也快。
我的集成例子和功能展示
我開發(fā)了一個新聞模塊來具體展示怎樣abp集成summernote并擴展summernote功能支持附件上傳功能，解決上面提到的summernote默認功能的不足。
例子中還包含了新聞模塊的全部代碼，展示了abp開發(fā)的全過程。如果您不想自己摸索，只需要贊助本人一瓶飲料的費用，并在留言中留下您的郵箱，我會很快（取決與是否在電腦旁邊）發(fā)送源代碼到您的郵箱，并感謝您的支持，下面是我的微信收款碼：
