[javascript] Marked를 사용하여 코드의 줄 번호를 표시하는 방법은?
- Marked 라이브러리를 다운로드하고 웹 페이지에 추가합니다.
<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
<pre>태그로 코드 블록을 감싸고,class속성에line-numbers를 추가합니다.
<pre class="line-numbers">
<code>
// 여기에 코드를 작성하세요.
</code>
</pre>
- JavaScript 코드에서
marked.setOptions()을 사용하여 줄 번호를 활성화합니다.
marked.setOptions({
langPrefix: 'line-numbers '
});
이제 코드 블록에 줄 번호가 표시됩니다. 이를 적용하기 위해서는 Marked 라이브러리가 필요하며, Prism 또는 highlight.js와 같은 코드 하이라이팅 라이브러리도 함께 사용할 수 있습니다.
참고 자료:
- Marked: https://marked.js.org/
- Prism: https://prismjs.com/
- highlight.js: https://highlightjs.org/