그누보드 - mvmEditor 0.1 > 그누보드5 플러그인

mvmEditor 0.1 > 그누보드5 플러그인

그누보드5 플러그인

그누보드는 다양한 기능을 추가하기 쉽습니다.

mvmEditor 0.1 정보

mvmEditor 0.1

첨부파일

mvmEditor.7z (7.7M) 24회 다운로드 2021-02-14 00:37:43

테스트한 버전5.4.5.1

호환 가능 버전5.4X 이상에서 테스트

본문

monaco-editor, higlightjs, markedjs, purifyjs, turndownjs를 활용한 마크다운 에디터입니다.

여러가지 오픈소스를 조합해 만들었으며 마크다운에 익숙한 개발자, vscode에 익숙한 개발자라면 사용하기 가장 편할것으로 생각됩니다.

모나코에디터는 vscode의 기반이 된 에디터이며, vscode에서 사용하는 멀티커서, 단축키, 코드하이라이트 기능 등을 그대로 활용할 수 있습니다.

코드하이라이트 작성을 vscode처럼 자동완성으로 도와주고, ctrl+k+f로 탭 및 정렬이 vscode처럼 지원되기때문에 코드하이라이트 작성이 무척이나 편할것으로 생각됩니다.

그누보드 용은 첨부된 파일을 받아주시고, 그 외에 곳에서 사용하려면 깃헙을 참고하세요.

https://github.com/ohah/mvmEditor

html로 변경되기에 굳이 뷰어는 필요 없으나 코드하이라이트 기능을 사용한다면 view.skin.php 페이지에서 별도의 하이라이트 기능을 사용하시려면 아래의 데모코드를 참고하여 수정하세요


//코드 하이라이트 사용시
<?php
$editor_url = G5_EDITOR_URL.'/'.$config['cf_editor'];
    add_stylesheet('<link rel="stylesheet" href="'.$editor_url.'/css/github-markdown.css">', 0);
    add_stylesheet('<link rel="stylesheet" href="'.$editor_url.'/css/hljs.default.min.css"', 0);
    add_javascript('<script src="'.$editor_url.'/js/highlight.min.js"></script>',0);
    add_javascript('<script src="'.$editor_url.'/js/mvmEditor.js"></script>',0);
    ?>
    <script>
        const viewer = new mvmEditorViewer('#bo_v_atc',{
            ele : "#bo_v_atc"
        });
 
    </script>
    <section id="bo_v_atc" class="markdown-body">


//코드하이라이트 미사용시
$editor_url = G5_EDITOR_URL.'/'.$config['cf_editor'];
add_stylesheet('<link rel="stylesheet" href="'.$editor_url.'/css/github-markdown.css">', 0);
<section id="bo_v_atc" class="markdown-body">