IntelliJ IDEA 2020.3 ヘルプ

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

Mermaid diagram in Markdown

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

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

  2. Markdown 拡張マーメイドまたは 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 コードスタイルをカスタマイズする

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

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

関連ページ:

コード補完

このセクションでは、コーディングプロセスのスピードアップを可能にするコンテキスト対応コード補完のさまざまなテクニックについて説明します。基本補完 :基本コード補完は、可視性スコープ内のクラス、メソッド、フィールド、キーワードの名前を完成させるのに役立ちます。コード補完を呼び出すと、IntelliJ

言語インジェクション

言語インジェクションを使用すると、コードに埋め込まれた他の言語のコードを操作できます。言語(HTML、CSS、XML、RegExp など)を文字列リテラルに挿入すると、そのリテラルを編集するための包括的なコード支援が得られます。言語インジェクションを使用する前に、IntelliLangプラグインが有...

コードインスペクション

IntelliJ IDEA には、コンパイル前にプロジェクト内の異常コードを検出して修正する一連のコードインスペクションがあります。IDE はさまざまな問題を見つけてハイライトし、デッドコードを見つけ、可能性のあるバグを見つけ、スペルの問題、コード構造全体を改善することができます。インスペクションは...

インテンションアクション

エディターで作業するときに、IntelliJ IDEA はコードを分析し、コードを最適化する方法を検索し、潜在的な問題と実際の問題を検出します。IDE がコードを変更する方法を見つけるとすぐに、エディターの現在の行の横に黄色いバルブアイコンが表示されます。このアイコンをクリックすると、このコード単位...

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

インターフェーステーマは、ウィンドウ、ダイアログ、ボタン、ユーザーインターフェースのすべての視覚要素の外観を定義します。デフォルトでは、最初の実行時に変更しない限り、IntelliJ IDEA は Darcula テーマを使用します。インターフェースのテーマは、色、フォント、さまざまなテキストリソー...

色とフォントの構成

開発者として、エディターのソースコード、検索結果、デバッガー情報、コンソールの入出力など、多くのテキストリソースを使用します。色とフォントスタイルは、このテキストのフォーマットに使用され、一目で理解しやすくなります。IntelliJ IDEA は、好適な色とフォントを定義するカラースキームを使用して...