chirimen-oh / chirimen.org

Tutorials for CHIRIMEN
https://tutorial.chirimen.org/
Mozilla Public License 2.0
3 stars 7 forks source link

example コードは Import して 2 重管理せずに済むように #43

Closed dynamis closed 5 years ago

dynamis commented 5 years ago

Github 同様の markdown ということで GFM を使っていて今のところ出来ないが、サンプルコードとチュートリアル本文の両方に同じコードを書いてメンテする必要が生じているのは望ましくないので js ファイルを markdown にインポートしたい。

例えば vuepress (markdown-it を利用) でこんな感じで出来るように

https://vuepress.vuejs.org/guide/markdown.html#import-code-snippets

GFM の拡張なのか Jekyll 側の処理なのか何かで出来ると良いなという願望メモ

kou029w commented 5 years ago

文書はinclude https://jekyllrb.com/docs/includes/ で挿入できるようです

Gistは jekyll-gist で埋め込めるようです gist-it.appspot.com は簡単そうですがXSSなどリスクあるかも

GitHub Pagesで利用可能なプラグイン https://help.github.com/en/articles/configuring-jekyll-plugins#default-plugins

dynamis commented 5 years ago

include は _includes ディレクトリ配下のファイルだけだし include_relative で挿入するのは配下のディレクトリのファイル限定なので今のディレクトリ構造では使えないんですよね。。。チュートリアル用のコードは同一リポジトリ内にまとめておきたいし。

Note that you cannot use the ../ syntax to specify an include location that refers to a higher-level directory.

dynamis commented 5 years ago

ディレクトリ名規則が /targetboard/locale/... になってるのを /locale/targetboard/... にすれば当然 include_relative が使えるし、そのようにすれば根性で複数 locale ディレクトリ内のファイルを編集するのではなく Polyglot での i18n 対応が可能 (実際のファイルを locale ディレクトリに入れずに並べておける&デフォルト言語へのフォールバックが出来る&相対リンクのパスとかの処理が出来る)。

see also: https://github.com/chirimen-oh/chirimen-oh.github.io/issues/1

従って、次のように対応するのがよさそう:

dynamis commented 5 years ago

polyglot 導入した https://github.com/chirimen-oh/tutorials/commit/26fe62dbf00b5c13e2a4f8ff478ff1c1ad820333

dynamis commented 5 years ago

import 導入の進捗:

note: 現在 jsbin でコードを書く想定になっているので js/css 読み込みタグの有無が異なるため HTML は include してはならないことに注意!まぁ JS が一番スタイル変更多いのでまずはそこだけでも includ にしてければ...

dynamis commented 5 years ago

同一コードがあるものは include した。