Prismトークン

Prismはコード内のトークンを識別し、CSSによってスタイルが適用されて構文ハイライトが生成されます。このページでは、標準トークンと対応する例の概要を示します。

標準トークン

新しい言語を定義する際には、キーワードや演算子など、コードの各「タイプ」のトークン名を指定する必要があります。これにより、Prismのテーマが適切に色（およびその他のスタイル）を割り当てることができます。Prismのテーマ（公式と非公式の両方）は、これらの標準トークンのみの対応を保証しているため、コードを確実にハイライト表示するには、以下の標準トークンを使用することをお勧めします。

汎用
keyword プリ定義および予約語。
for (const foo of bar) {
	if (foo === 'foobar') break;
	await foo;
}
builtin すぐに使用できる関数/メソッド/クラス/型。
pi = round(float('3.14159'), 2)
type SearchFunc = (source: string, subStr: string) => boolean;
class-name クラス、インターフェース、トレイト、または型の名前。
class Rectangle extends Square { /* ... */ }
public class CameraController : MonoBehaviour { /* ... */ }
function 関数またはメソッドの名前。
function isEven(number) {
	return Number(number) % 2 === 0;
}
const isOdd = (number) => !isEven(number);
boolean 真と偽、および同様の概念のペア（例：yesとno）。
console.log(true === false); // prints false
console.log(true === !false); // prints true
number 数値。基数や順序、実数か虚数かに関係なく。
print(3.14159 * 42)
print(1e100 + .001j)
return foo & 0xdeadbeef
string リテラルテキスト。数字、記号、さらに特別な文字を含む場合があります。
let greeting = 'Hello World!';
char 1文字のみで構成できる文字列。言語によって強制されます。
['A', 'z', '0', '-', '\t', '\u{2728}']
symbol 一部の言語に見られるプリミティブなデータ型。識別子と考えることができます。
#myFirstSymbol "#myFirstSymbol is a symbol in Smalltalk"
regex 正規表現。
let entity = /&#x?[\da-f]{1,8};/;
url 別のページまたはリソースへのリンク。
body {
	background: url(foo.png);
}
[Prism](https://prism.dokyumento.jp) is a cool syntax highlighter.
operator アクションまたはプロセスを表す記号。算術演算、論理演算など。
x += (y + 4 >> -z === w) ? b ** c : ~a;
variable 変数の名前。このトークンは控えめに使用する必要があります。一般的には、命令型および手続き型プログラミング言語（例：C、JavaScript、Python）の一般的な変数ではなく、特殊な変数（例：LessまたはBash）で使用されます。
@nice-blue: #5B83AD;
@light-blue: lighten(@nice-blue, 20%);
echo $STRING
args=("$@")
echo ${args[0]} ${args[1]} ${args[2]}
constant 定数の名前。
const PI = 3.14159;
const THING: u32 = 0xABAD1DEA;
fprintf(stdout, "hello world\n");
property 属性/特性またはオブジェクト/マップキー。
body {
	color: red;
	line-height: normal;
}
{
	"data": { "labels": ["foo", "bar"], },
	"error": null,
	"status": "Ok"
}
punctuation 句読点（ブラケット、括弧、コンマなど）。
def median(pool):
	copy = sorted(pool)
	size = len(copy)
	if size % 2 == 1:
		return copy[(size - 1) / 2]
	else:
		return (copy[size/2 - 1] + copy[size/2]) / 2
important 重要で特別な強調表示が必要なもの。
body {
	color: red !important;
}
# This is a heading. Headings are important.
comment コードコメント。
<!-- Here's a comment -->
<style>
	/* Here's another comment */
</style>
<script>
// Here's yet another comment
</script>
マークアップ言語
tag マークアップタグ（例：HTMLおよびXMLタグ）。
<p>Hello World!</p>
attr-name、attr-value マークアップタグの属性とその値/引数のようなものです。
<p id="greeting">Hello World!</p>
<video width="1280" height="720" allowfullscreen controls>
	<source src="hello_world.mp4" type="video/mp4" />
</video>
namespace XML文書で一意に名前付けられた要素と属性を提供するために使用されます。マークアップ言語以外では、識別子のパッケージ/名前空間部分をトークン化するために使用されます。
<html:p foo:bar="baz" foo:weee></html:p>
class Foo extends foo.bar.Foo {
	java.util.List<foo.bar.Foo.Bar> bar(foo.bar.Baz bat) {
		throw new java.lang.UnsupportedOperationException();
	}
}
use std::sync::Arc;
prolog XML文書の最初の部分。
<?xml version="1.0" encoding="utf-8"?>
<svg></svg>
doctype 文書型宣言。マークアップ言語に固有です。
<!DOCTYPE html>
<html></html>
cdata 文字データ。マークアップ言語に固有です。
<ns1:description><![CDATA[
  CDATA is <not> magical.
]]></ns1:description>
entity マークアップ言語で予約文字を表示するために使用されるコード。
&amp; &#x2665; &#160; &#x152;
ドキュメントマークアップ言語
bold 太字テキスト。主にドキュメントマークアップ言語に見られます。
**I am bolded text!**
italic 斜体テキスト。主にドキュメントマークアップ言語に見られます。
*I am italicised text!*
スタイルシート
atrule 文字通りスタイルシートの@ルール（ステートメント）。
@font-family {
	font-family: Questrial;
	src: url(questrial.otf);
}
@media screen and (min-width: 768px) { /* ... */ }
selector スタイルシートなど、操作対象のグループから何かを識別または選択するコード（例：スタイルシートでのHTML要素の名前）。
section h1,
#features li strong,
header h2,
footer p { /* ... */ }
差分
inserted、deleted それぞれ追加または変更された行と削除された行。主に差分用。一般的には、何かが増加および減少/削除されたという概念です。
--- bar.yml	2014-12-16 11:43:41 +0800
+++ /Users/foo/Desktop/bar.yml	2014-12-31 11:28:08 +0800
@@ -4,5 +4,5 @@
project:
	sources: "src/*.cpp"
	headers: "src/*.h"
-    qt: core
+    qt: core gui
public_headers: "src/*.h"

埋め込み言語

上記の標準トークンに加えて、Prismには、HTML内のCSS、HTML内のJS、シェルセッション内のBash、JS内のCSSなど、別の言語に埋め込まれた言語（例：HTML内のCSS）のトークンもあります。これにより、Prismのテーマは埋め込み言語のトークンをより正確にハイライト表示できます。すべての埋め込み言語は独自の特別なトークンで囲まれており、埋め込み言語に対応するCSSクラスlanguage-xxxxが含まれています。

ブラウザの開発者ツールを開き、以下の例を確認して動作を確認してください！

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8" />
	<title>I can haz embedded CSS and JS</title>
	<style>
		@media print {
			p { color: red !important; }
		}
	</style>
</head>
<body>
	<h1>I can haz embedded CSS and JS</h1>
	<script>
	if (true) {
		console.log('foo');
	}
	</script>

</body>
</html>

非標準トークン

場合によっては、言語で特定のコードの部分を参照するために特定の名前を使用する場合がありますが、それはPrismの標準トークン名（例：function-definition）ではありません。function-definitionは標準トークンではないため、意味的に類似しており、Prismのテーマがハイライト表示することを保証する標準トークン（例：function）にエイリアスを付けることができます。例を以下に示します。

fn main() {
	println!("Hello World");
	another_function();
}