AtCoder Better Highlighter
AtCoderの提出結果ページのコードをhighlight.jsでハイライトしたものに置き換えるスクリプトです．
デフォルトで置き換わる言語
- Bash
- C
- C++
- C#
- Go
- Java
- JavaScript
- Kotlin
- Objective-C
- PHP
- Perl
- Python
- Ruby
- Rust
- Swift
- TypeScript
上記以外の言語で置き換えるには
まずはスクリプトの編集画面を開きましょう．方法は2通りあります．
方法1 依存ライブラリを追加する
https://cdnjs.com/libraries/highlight.js のリストから，置き換えたい言語のスクリプトのURLをコピーし，スクリプト冒頭にある
// @require https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.1.2/highlight.min.js
の次の行に以下の行を追記しましょう．{コピーしたURL} を先ほどコピーしたURLで置き換えて下さい．
// @require {コピーしたURL}
方法2 eval() を使用する
この方法ではhighlight.jsが対応している全ての言語の置き換えが可能になります．しかしながら，よく知られているようにeval()の使用には危険が伴います．その点を踏まえた上でこの方法を使って下さい．
スクリプト84行目付近に
if (!hljs.getLanguage(name)) {
// const response = await fetch(`https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.1.2/languages/${name}.min.js`);
// eval(await response.text());
return;
}
という記述があるので，これを以下のように書き換えましょう．
if (!hljs.getLanguage(name)) {
const response = await fetch(`https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.1.2/languages/${name}.min.js`);
eval(await response.text());
// return;
}
別のテーマを使うには
デフォルトではhighlight.jsのdefault.cssを使用しています．テーマを別のものに変えるには， https://cdnjs.com/libraries/highlight.js のリストから目的のcssのURLをコピーし，スクリプト冒頭の
// @resource css https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.1.2/styles/default.min.css
を以下のものに置き換えましょう．{コピーしたURL} を先ほどコピーしたURLで置き換えて下さい．
// @resource css {コピーしたURL}
