...
Code Mirror 등 외부 모듈을 적용하여 더 강력한 기능을 사용할 수 있습니다.
적용 가능한 외부 모듈은 아래와 같습니다.
- Code Mirror (https://codemirror.net/)
- Formula Parser (https://github.com/handsontable/formula-parser)
Code Mirror 적용
코드미러를 적용하면 에디터의 '소스 보기' 에서 코드 편집을 원활하게 할 수 있습니다.
코드미러를 적용하지 않았을 때 '소스 보기' | 코드미러를 적용했을 때 '소스 보기' |
---|---|
Code Mirror 사이트에서 js 파일과 css 파일을 다운받아 경로를 추가해 주거나, CDN 을 이용해 코드미러를 적용할 수 있습니다.
또는 사이냅 에디터 패키지의 externals 디렉토리에 포함된 codemirror 스크립트 파일을 사용하셔도 됩니다.
적용방법
package externals 사용
package 하위 externlas codeMirror script file externals/codeMirror에 포함되어 있는 codemirror.min.js와 xml.min.js 사용
Code Block | ||||||||
---|---|---|---|---|---|---|---|---|
| ||||||||
<!-- code mirror --> <script type="text/javascript" src='..externals/resourcecodeMirror/codemirror.min.js'></script> <script type="text/javascript" src="..externals/resourcecodeMirror/xml.min.js"></script> <link rel='stylesheet' href='..externals/resourcecodeMirror/codemirror.min.css'> |
CDN 을 이용한 적용
에디터가 설치된 html 파일 <head> 태그에 아래 내용을 추가합니다.
...