Published on

code titleの追加とresolve

Authors

このブログ内でコードスニペットにタイトルをつけたくて、gatsby-remark-code-titles を入れてみました。
インストール方法や使い方は公式サイト参照

このサイトはスターターを使用していて、すでに gatsby-transformer-remark の中で gatsby-remark-prismjs が使われていました。

title=gatsby-config抜粋
{
      resolve: `gatsby-transformer-remark`,
      options: {
        plugins: [
          `gatsby-remark-prismjs`,
        ],
      },
    },

公式サイトを見ると、gatsby-transformer-remark の中に入れて使うようです。
すでに prism が使われているので。その下に

title=gatsby-config抜粋
{
      resolve: `gatsby-transformer-remark`,
      options: {
        plugins: [
          `gatsby-remark-prismjs`,
          {
          resolve: 'gatsby-remark-code-titles',
        },
        ],
      },
    },

というように入れたところ、うまく反映されませんでした。
ようく公式を読んでみると How to use に
IMPORTANT: this must be ahead of other plugins that use code blocks と書いてあるじゃないですか。

素直に先頭に記述したところ無事反映されました。 (ちゃんとコードスニペットのタイトルが表示されてるでしょうか)

もともと React、javascript をきちんと勉強してきたわけじゃないので、gatsby-config 内のresolveという書き方はどういうことなんだろうと調べました。
Gatsby でやっているのもこういうことで合っているんでしょうか?
が!まだ消化するには時間切れです。眠い…。
条件分岐の発展型みたいな感じなんでしょうか??
実践で使っていかなきゃ身につかないと思うけど、勉強したいことが増えていく。