📝
React JSX内のコメントアウト記述方法
Next.jsでフロントの実装中、JSX内でコメントアウトを記述する方法がわからなかったためメモ。
1行コメント
hello.tsx
return (
<div>
{/* 1行コメント */}
Hello world!
{
// 1行コメント
}
<div>
)
Error:
x Unexpected token `div`. Expected jsx identifier
,-[hello.tsx:17:1]
17 | return (
18 | <div>
: ^^^
19 | {/* 1行コメント */}
20 | Hello world!
21 | { // 1行コメント}
`----
Caused by:
Syntax Error
複数行コメント
hello.tsx
return (
<div>
{/* 改行で
複数行コメント
記載可能 */}
Hello world!
{
// 1行コメントを
// 複数行記載も
// OK
}
</div>
)
// は構文エラーを配慮する必要があるため、特に理由がなければ1行コメントでも /* */ 使うのが良さそう。
参考
Discussion