Open2024/04/14にコメント追加17

GithubPagesでOrgajs(gatsby)をホストする

Github Pages でgatsybyのホスト
- リポジトリの作成
- nodejsのインストール
orgajs で org-mode のファイルを読み込めるようにする

参考リンク

まず node いれる必要があった
fnm使ってみよう

https://github.com/Schniz/fnm

ちなみに bun で gatsby.js はまだ動かないっぽい (GraphQL関連とのこと)

とりあえず最新のnodeをいれておくか

brew install fnm
fnm install v21.7.3

このタイミングで fish にしておくか…

brew install fish

Create ~/.config/fish/conf.d/fnm.fish add this line to it:

fnm env --use-on-cd | source

node 対応

set -x PATH ./node_modules/.bin $PATH

install するGatsby はこっちでいこう

error で引っかかった

Error: [ERR_REQUIRE_ESM]: require() of ES Module /*****/gatsby-site/node_modu
  les/@orgajs/orgx/index.js from /*****/gatsby-site/node_modules/gatsby-plugin-
  orga/gatsby-node.js not supported.
  Instead change the require of index.js in /*****/gatsby-site/node_modules/gat
  sby-plugin-orga/gatsby-node.js to a dynamic import() which is available in all CommonJS modules.

Library のメンテの問題なんかな

一旦、gatsby-plugin-orga plugins 外したら動きはする
GithubPages 上に乗せるの優先でいくか

一応その前にこのサイトのやつだけ試す (多分動かない気がする)
→ お、動いたぞ

ただ、今度はBuildが動かない

 ERROR #85901  GRAPHQL

There was an error in your GraphQL query:

Cannot read properties of undefined (reading 'indexOf')

   8 |
   9 | query PostById($id: String!, $maxWidth: Int) {
  10 |   orgPost(id: {eq: $id}) {
  11 |     title
  12 |     category
  13 |     excerpt
  14 |     date(formatString: "MMMM DD, YYYY")
  15 |     tags
  16 |     html
  17 |     slug
> 18 |     wordCount
     |     ^
  19 |     image {
  20 |       childImageSharp {
  21 |         fluid(maxWidth: $maxWidth) {
  22 |           ...GatsbyImageSharpFluid
  23 |           src
  24 |         }
  25 |       }
  26 |     }
  27 |   }
  28 | }

File path:
/*****/gatsby-site/node_modules/gatsby-theme-orga/src/templates/post-query.js
Url path: /first-thing-first
Plugin: none

TypeError: Cannot read properties of undefined (reading 'indexOf')

対処として /node_modules/gatsby-theme-orga/src/templates/ の

    html
    timeToRead
    wordCount

を消したら一旦 build 通ってくれた

orga playground
https://orga.js.org/playground/

gatsby と gh-pages

node_modules/.bin のPATH通さなきゃ

お、 CSSの挙動は怪しいけど、とりあえず上げることはできた模様

html 消したことによる影響っぽいけど、本文がでなくなってしまっている

orgajs の Parse のところで問題が起きているのだろうか

ちょっとこの路線を深ぼるのは一旦ストップしよう

orga を直接使ってみる

なんか vscode-jest の設定がうまくいかない…
jest 自体はうまくいく

jest が CommonJS ES2016 あたりで全くうまく行っていなかったけど、
bun インストールして test したら一瞬でうまくいった… どうなっとんねん

とりあえず orga がパースできてそうなことは確認

今更だけど、 uniorg もある
こっちのほうがメンテされているんかな?

https://github.com/rasendubi/uniorg
https://oleksii.shmalko.com/uniorg/

この一覧にないから漏れていたな

uniorg VS orga

json を比較 ( 左が uniorg で右が orga )

* org-mode example\n your text goes here

構造は結構異なる

memo

uniorg のほうがかなりシンプル
uniorg tag とかも取れていなさそう?
- そんなことはなかった
一番の違いは children としてテキスト以外も持つかとかになってそう
- nested あたりがどんなもんかってのはありそう

* TODO org-mode example :tag:\n your text goes here

→ orgaのほうがよさそう

Orgのunified を TaskItem に変換する
お作法に乗っかれるんかな?

Unified JS
https://unifiedjs.com/learn/

org-mode をParse する
- uniorg or orgajs がよさそう
読み込んだ Tree の nodeのアップデート(編集)
Org-mode ファイル変更 → jgGannt 更新される