IntelliJ IDEA 2021.1 ヘルプ

Markdown

Markdown(英語) は、プレーンテキストにフォーマット要素を追加するための軽量マークアップ言語です。IntelliJ IDEA は Markdown ファイルを認識し、ハイライト、補完、フォーマットを備えた専用エディターを提供し、ライブプレビューペインにレンダリングされた HTML を表示します。

新しい Markdown ファイルを作成する

デフォルトでは、IntelliJ IDEA は、.md または .markdown 拡張子を持つすべてのファイルを Markdown ファイルとして認識します。

  1. プロジェクトツールウィンドウ Alt+1 でディレクトリを右クリックし、新規 | ファイルを選択します。

    または、必要なディレクトリを選択し、Alt+Insert を押してから、ファイルを選択することもできます。

  2. 認識された拡張子を持つファイルの名前を入力します(例: readme.md)。

Markdown エディターは、ツールバーにいくつかの基本的なフォーマットアクションを提供します。

  • Bold : 太字

  • Strikethrough : 取り消し線

  • Italic : 斜体

  • Code : コード

  • Decrease header level : 見出しレベルを下げる

  • Increase header level : 見出しレベルを上げる

  • Introduce reference : インラインリンクを参照リンクに変換する

プレビューペインを使用して、レンダリングされた HTML を表示できます。

Markdown editor

ソースコード、イメージ、またはその他の Markdown ファイルを参照する必要がある場合など、現在のプロジェクト内のファイルへのリンクも完了しています。

コードブロック

フェンスで囲まれたコードブロックを挿入するには、コードブロックの前後にトリプルバッククォート(```)を使用します。コードブロックの言語を指定すると、デフォルトで、Markdown エディターは対応する言語を挿入します。これにより、指定された言語(コード補完インスペクション、およびインテンションアクション)の構文ハイライトおよびその他のコーディング支援機能が有効になります。

Insert a fenced code block in Markdown

コードブロックのコーディング支援を無効にする

コードブロックが構文的に正しいことを意図していない場合は、コードブロックのコードインジェクションと構文エラーを無効にすることをお勧めします。

  1. 設定 / 環境設定ダイアログ Ctrl+Alt+S で、言語 & フレームワーク | Markdown を選択します。

  2. 次のオプションを構成します。

    コードフェンスで自動言語インジェクションを無効にする コードブロックにコーディング支援をインジェクションしないでください。
    コードフェンスのエラーを非表示にする 構文にエラーがないかチェックしないでください。
  3. 変更を適用するには、OK をクリックします。

ダイアグラム

Markdown エディターは、Mermaid(英語) および PlantUML(英語) で定義された図をレンダリングできます。これはデフォルトで無効になっており、対応する Markdown 拡張機能が必要です。

Mermaid diagram in Markdown

ダイアグラムのサポートを有効にする

  1. 設定 / 環境設定ダイアログ Ctrl+Alt+S で、言語 & フレームワーク | Markdown を選択します。

  2. Markdown 拡張Mermaid または PlantUML のいずれかを有効にします。

  3. IntelliJ IDEA が関連する拡張機能をダウンロードしたら、OK をクリックして変更を適用します。

HTML プレビュー

デフォルトでは、Markdown エディターは、Markdown ファイルに基づいてレンダリングされた HTML コードのプレビューペインを横に表示します。Markdown エディターの右上隅にある The Show Editor Only button または The Show Preview Only button を使用して、エディターまたはプレビューペインのみを表示できます。

エディターとプレビューペインのスクロールバーは同期されています。つまり、プレビューペインの場所はソースの場所に対応しています。これを無効にするには、Markdown エディターの右上隅にある The Auto-Scroll Preview button をクリックします。

エディターとプレビューペインをデフォルトの垂直分割ではなく水平(上下)に分割するには、設定 / 環境設定ダイアログ Ctrl+Alt+S で、言語 & フレームワーク | Markdown を選択し、エディターとプレビューパネルのレイアウト横に分割を選択します。

Markdown editor and live preview pane split horizontally

カスタム CSS

IntelliJ IDEA は、プレビューペインで HTML をレンダリングするためのデフォルトのスタイルシートを提供します。これらのスタイルシートは、デフォルトの UI テーマと一致するように設計されています。特定の CSS ルールを構成して、プレゼンテーションを少し変更する(たとえば、リストの見出しや行間隔のフォントサイズを変更する)か、まったく新しい CSS を提供して、期待される出力に一致させることができます(たとえば、複製する場合、GitHub Markdown スタイル)。

Markdown preview with a custom CSS that resembles GitHub rendering style
  1. 設定 / 環境設定ダイアログ Ctrl+Alt+S で、言語 & フレームワーク | Markdown を選択します。

  2. カスタム CSS で設定を構成します。

    • URI からロードを選択して、カスタム CSS ファイルの場所を指定します。

    • CSS ルールの追加ルールを選択して、オーバーライドする特定の CSS ルールを入力します。

Markdown ファイルを再フォーマットする

IntelliJ IDEA は、適切な行の折り返し、空白行、インデントを使用して Markdown ファイルをフォーマットできます。詳細については、コードの再フォーマットと再配置を参照してください。

  • メインメニューからコード | コードの整形を選択するか Ctrl+Alt+L を押します。

IntelliJ IDEA は、Markdown ファイルのコードスタイル設定に従ってコンテンツをフォーマットします。

Markdown コードスタイル設定を構成する

  • 設定 / 環境設定ダイアログ Ctrl+Alt+S で、エディター | コードスタイル | Markdown を選択します。

Markdown コードスタイル設定には、次のものが含まれます。

改行のオプションを構成します。

次でハードラップ 改行を配置する列を指定します。IntelliJ IDEA は、指定された列に縦線を表示し、単語内ではなく単語間で線を区切ります。
入力時に折り返す 入力時に改行を追加します。IntelliJ IDEA がフォーマットを実行する場合にのみ改行を追加するには、このオプションを無効にします。
ビジュアルガイド 指定した列に追加の垂直線を表示します。

テキストブロックのネストとブロック内の配置のオプションを構成します。

タブ文字を使用する インデントにはタブ文字を使用します。インデントにスペースを使用するには、このオプションを無効にします。
スマートタブ ブロックをタブでネストし、スペースに揃えます。タブのみを使用し、指定したタブサイズに合うスペースをタブに置き換えるには、このオプションを無効にします。
タブサイズ 1 つのタブ文字の代わりにレンダリングするスペースの数を指定します。
インデント 各インデントレベルに使用されるスペースの数を指定します。
連続インデントの文字数 同じテキストブロックを継続するために使用されるスペースの数を指定します。
空行でインデントを保持する 空の行にタブとスペースを保持します。デフォルトでは、このオプションは無効になっており、IntelliJ IDEA は、その行に他に何もない場合、タブとスペースを削除します。

さまざまなテキスト要素に対して保持する空白行の最大数と最小数を設定します。

ヘッダー周辺 章の見出しの前後。
ブロック要素の周辺 コードブロックの前後。
段落の間 2 つの隣接する段落の間。

どの要素にスペースを 1 つだけ含めるかを指定します。

単語の間 単語間の余分なスペースを削除します。
ヘッダー記号の後 余分なスペースを削除するか、ヘッダー記号とヘッダータイトルの間に不足しているスペースを追加します。
リストマーカーの後 余分なスペースを削除するか、リストアイテムマーカーとリストアイテムテキストの間に不足しているスペースを追加します。
ブロッククォートマーカーの後 余分なスペースを削除するか、ブロック引用符マーカーとブロック引用符のテキストの間に欠落しているスペースを追加します。

生産性のヒント

Markdown のハイライトをカスタマイズする

IntelliJ IDEA は、配色設定に従ってさまざまな Markdown 要素をハイライトします。

  1. 設定 / 環境設定ダイアログ Ctrl+Alt+S で、エディター | カラースキーム | Markdown を選択します。

  2. 配色を選択するか、デフォルトから継承されたハイライト設定を受け入れるか、色とフォントの構成の説明に従ってカスタマイズします。

  • 構造ツールウィンドウ Alt+7 またはファイル構造ポップアップ Ctrl+F12 を使用して、関連する見出しを表示してジャンプします。

Markdown ファイルにコメントを追加する

Markdown には、行をコメントアウトするための専用の構文はありません。ただし、次のように、アドレスのないリンクラベルを使用してコメント行をエミュレートすることは可能です。

[comment]: <> (Your comment text)

  • コメントアウトする行にキャレットを置き、Ctrl+/ を押します。

    これにより、コメントアウトされたテキストが括弧で囲まれ、必要に応じてその前に空白行が含まれるリンクラベルが追加されます。コメントを解除するには、同じショートカットを押します。

関連ページ:

コード補完 | IntelliJ IDEA

このセクションでは、コーディングプロセスのスピードアップを可能にするコンテキスト対応コード補完のさまざまなテクニックについて説明します。基本補完:基本コード補完は、可視性スコープ内のクラス、メソッド、フィールド、キーワードの名前を完成させるのに役立ちます。コード補完を呼び出すと、IntelliJ IDEA はコンテキストを分析し、現在のキャレット位置から到達可能な選択肢を提案します(提案にはライブテンプレートも含まれます)。基本コード補完がフィールド、パラメーター、または変数宣言の一部に適用さ...

言語インジェクション | IntelliJ IDEA

言語インジェクションを使用すると、コードに埋め込まれた他の言語のコードを操作できます。言語(HTML、CSS、XML、RegExp など)を文字列リテラルに挿入すると、そのリテラルを編集するための包括的なコード支援が得られます。PHP のコンテキストでは、インジェクション可能な PHP と呼ばれる特別な PHP ダイアレクトを使用できます。このダイアレクトは、省略可能な開始タグを除いて、PHP に似ています。インジェクション可能な PHP は、他の言語と同様に、文字列リテラルに手動で挿入できます。さ...

コードインスペクション | IntelliJ IDEA

IntelliJ IDEA には、コンパイル前にプロジェクト内の異常コードを検出して修正する一連のコードインスペクションがあります。IDE はさまざまな問題を見つけてハイライトし、デッドコードを見つけ、可能性のあるバグを見つけ、スペルの問題、コード構造全体を改善することができます。インスペクションは、すべてのプロジェクトファイル内のコード、または特定のスコープ内のみ(たとえば、本番コード内、または変更されたファイル内)のコードをスキャンできます。すべてのインスペクションには、問題がコードに影響を...

インテンションアクション | IntelliJ IDEA

エディターで作業するときに、IntelliJ IDEA はコードを分析し、コードを最適化する方法を検索し、潜在的な問題と実際の問題を検出します。IDE がコードを変更する方法を見つけるとすぐに、エディターの現在の行の横に黄色いバルブアイコンが表示されます。このアイコンをクリックすると、このコード単位で使用可能なインテンションアクションを表示できます。インテンションアクションは、警告から最適化の提案まで、幅広い状況をカバーします。インテンションの完全なリストを表示し、設定 / 環境設定ダイアログ...

ユーザーインターフェースのテーマ | IntelliJ IDEA

インターフェーステーマは、ウィンドウ、ダイアログ、ボタン、ユーザーインターフェースのすべての視覚要素の外観を定義します。デフォルトでは、IntelliJ IDEA の初回起動時に変更した場合を除き、Darcula テーマを使用します。UI テーマを変更する設定 / 環境設定ダイアログで、外観 & 振る舞い | 外観を選択します。テーマリストから UI テーマを選択します。IntelliJ Light: IntelliJ ベースの IDE の従来のライトテーマ、macOS Light または Win...

コードの再フォーマットと再配置 | IntelliJ IDEA

IntelliJ IDEA では、コードスタイル設定で指定した要件に従ってコードを再フォーマットできます。ただし、プロジェクトで EditorConfig を使用する場合、ファイルで指定されたオプションは、コードを再フォーマットするときにコードスタイル設定で指定されたオプションをオーバーライドします。設定にアクセスするには、設定 / 環境設定ダイアログでに移動します。詳細については、コードスタイルの構成を参照してください。コードの一部、ファイル全体、ファイルのグループ、ディレクトリ、モジュールを再...