테스트 사이트 - 개발 중인 베타 버전입니다

mvmEditor 0.1

· 4년 전 · 4047 · 6
화면 캡처 2021-02-14 003726.png

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

 

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

 

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

 

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

 

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

 

https://github.com/ohah/mvmEditor

 

3667491413_1613230474.411.png

3667491413_1613230488.5628.png

 

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

 

[code]

//코드 하이라이트 사용시

<?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">

[/code]

 

[code]

//코드하이라이트 미사용시
$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">

[/code]

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

댓글 6개

감사합니다. 깃헙 링크는 에러가 나네요
복귀해서 테스트한번 해봐야겠네요.
감사합니다.
감사합니다
4년 전
감사합니다
감사합니다.
3년 전
테스트로 해봤는데 문제가 있더군요.. 다른거 찾아봐야겠어요

게시글 목록

번호 제목
14082
14058
14056
14047
14035
14026
14019
14012
13997
13988
13975
13969