日傘@5/5東7K04a
@pallasoul
とりあえずチュートリアルを一通り試してみる HTML無いの～？と思ってたら普通にカレントにできてたわ vivliostyle.org/ja/tutorials/c…
2022-09-20 21:01:56
日傘@5/5東7K04a
@pallasoul
Nodejsの勉強にちょっとだけドキュメントも読む npmと同じレイヤーにいるのがpip、pyenv（チョト違う？）という認識。vivliostyleは有志のオープンソースプロジェクトで、その開発成果の一つがcreatebook、このパッケージの中に原稿テーマやHTML作成用のモジュールが含まれると理解した。
2022-09-20 21:12:31
日傘@5/5東7K04a
@pallasoul
初期選択するlicenseってなんだろ～と思ったけど、ソースコード配布に関係するもので、制作物に対してのものではない、という理解で合ってるかな？作成したPDFやHTMLが商用利用可かそうじゃないか、とかではないという認識。
2022-09-20 21:19:00
日傘@5/5東7K04a
@pallasoul
あ、previewいいですねえ 見開きPDFだ UIすごく好み 反映速度も20ページ弱ならそこまで悪くないかも これはA6文庫のデフォルトに9000字くらいのテキストを仮で流し込んでいます pic.twitter.com/T9MHWMeINJ
2022-09-20 21:25:45
拡大
日傘@5/5東7K04a
@pallasoul
同時に作成されてたhtmlこんな感じ マジでそのまんまだ～おもしろ～ pic.twitter.com/xXJM1wMyBS
2022-09-20 21:29:09
拡大
日傘@5/5東7K04a
@pallasoul
scssのcss変換コマンド、上手くいかなくときはpackage.jsを確認ってプログラミング初学者には酷じゃないか？あと普通に動かないから調べたけどもしかしてwinだとコマンド中のコロンを認識しない？同じスクリプトでもコマンド中に:が入ってないpreviewは正常動作、buildはエラーが出た pic.twitter.com/ChK6g5XFg0
2022-09-20 22:19:28
拡大
日傘@5/5東7K04a
@pallasoul
このケースとは逆かな スクリプト名にコロンが含まれててもいいけど、スクリプト本体にコロンが含まれてると駄目っぽい？
2022-09-20 22:26:37
日傘@5/5東7K04a
@pallasoul
単純にscssが入ってないっぽい scripts定義の下でdevDependencies定義でライブラリ宣言してるけど見た感じ読まれてない node_modulesに直接scss入れてみるか
2022-09-20 22:52:41
日傘@5/5東7K04a
@pallasoul
直った エイリアスはscssだけど実行してるコマンドはsassなのね、ようやく気付いた node_modulesにnpm install sassで入れたらいけました コロン関係なく普通にパッケージが足りなかっただけです
2022-09-20 23:00:46
日傘@5/5東7K04a
@pallasoul
おっけ～cssファイルの変更がプレビューに反映されました ここからゴリゴリページレイアウトをいじっていきます pic.twitter.com/uSv3Fe2RS8
2022-09-20 23:05:48
拡大
日傘@5/5東7K04a
@pallasoul
devDependenciesが適切に読み込まれてない問題はどこかで解決したいですね ハード依存ではない気がする npmのバージョンが上がって有効な宣言じゃなくなった？
2022-09-20 23:09:12
日傘@5/5東7K04a
@pallasoul
これがページ設定部分だけど、パッと見た感じかなり自由度高そうでいいですね左右で変えられるの便利～見開き前提で設定されているのが良いところ やっぱり設定ファイルは一か所にまとまってるのがいいよ～ pic.twitter.com/WgnQZNvzbY
2022-09-20 23:13:24
拡大
日傘@5/5東7K04a
@pallasoul
あえて読み込まないライブラリ宣言ということで理解した これチュートリアルそのまま使えるユーザーいるのか？私のやり方が悪いのかな なんかすっ飛ばしてる？ qiita.com/cognitom/items…
2022-09-20 23:29:37
日傘@5/5東7K04a
@pallasoul
間違えたから再掲 まずはチュートリアルを終らせます 今日はここから スタイルをイチから作るやり方ですね ここ見れば既存スタイルのどこいじればいいか大体分かりそう vivliostyle.org/ja/tutorials/c…
2022-09-24 11:30:26
日傘@5/5東7K04a
@pallasoul
書いてある通りにソースDLしてpreviewしたけど、表示がチュートリアル通りにならない 最初に好き勝手にページサイズとかをどっかのファイルでいじっちゃったからだと思うので、buildし直しました んー、buildとpreviewの関係ちゃんと見とかないと反映されてないと思ってテンパりそう
2022-09-24 11:40:11
日傘@5/5東7K04a
@pallasoul
previewで見るchromiumの表示とbuildで出来上がったPDFの見た目が違いますね これ困るな （両方２，３ページ目を見開きモードで表示） 拡大縮小という問題ではなさそう pic.twitter.com/2mEkHhmRKm
2022-09-24 11:46:20
拡大
拡大
日傘@5/5東7K04a
@pallasoul
問題切り分ける前に原因を断定するのよくないですね 結果としての良い悪いは置いといて考え方の順序やルールとしてよくないので気を付けます まずはページサイズ設定ファイルを確認してみましょうか その次にchromiumの表示オプションを確認しましょう
2022-09-24 11:47:40
日傘@5/5東7K04a
@pallasoul
くそやっぱgit保存しときゃよかったな チュートリアル③から、私が原稿サイズとか設定いじれる楽しい～と思っていじったのはカレントのvivliostyle.config.jsだと思う そこでsize設定項目があってそこをA6からB5にしたような気がする 今回チュートリアル④に従ってDLしたconfigにはsizeの記述が
2022-09-24 11:51:20
日傘@5/5東7K04a
@pallasoul
削られていたので、それが悪さをしているわけではなさそう。ほかにページサイズの設定をしているとしたらthemesだけど、これはDLして上書き済みなので関係ないはず とするとやっぱりchromiumの表示オプションかなあ
2022-09-24 11:54:02
日傘@5/5東7K04a
@pallasoul
デフォルトだと表示のページ設定がAutoになっているので、custum sizeに変更、A4設定ですね うーん、文字サイズもデフォルトにしてお手本に近づいたけど、まったく同じにはならない… pic.twitter.com/IIWEL70cr4
2022-09-24 12:07:02
拡大
拡大
日傘@5/5東7K04a
@pallasoul
いや別に本題には関係ないしPDF出力は合ってるからこの問題スキップしてもいいんですけど、それだとプレビューの意味がまったくなくなるので解決したいんですよね プレビュー表示ありきの修正なので
2022-09-24 12:12:00
日傘@5/5東7K04a
@pallasoul
見た感じページサイズとフォントサイズは合ってて、多分行間が広いんですよね、ローカル環境のほうが ていうか微妙にインデントもついてるし ぜんぜんまっさらじゃないな 一回別プロジェクト立ててやり直してみっか
2022-09-24 12:14:48
日傘@5/5東7K04a
@pallasoul
おっと ちゃんと見ましたけど、チュートリアルだとbunkoテーマのサンプル文章は銀河鉄道ですが、実際やってみると吾輩は猫ですね また何か間違ったかな
2022-09-24 12:28:18
日傘@5/5東7K04a
@pallasoul
なんか多分チュートリアルで扱ってるもろもろのバージョンとローカル環境のバージョンが違うせいな気がするんですが、これ掘ってくのタルいなあ…とりあえずチュートリアル④を試してみるか
2022-09-24 12:34:25
日傘@5/5東7K04a
@pallasoul
やりたい設定 ・用紙はB6（テストなので上下左右マージンなし） ・縦書き一段 ・52文字*18行くらい？適当 ・画面下にページ数 ・タイトルなし、冒頭３行空け ・ヘッダータイトルなし
2022-09-24 12:43:06
日傘@5/5東7K04a
@pallasoul
チュートリアル通りにやってなかったのが間違いですね npm run watch:scssを実行しながら別ターミナルでpreviewしないと反映されない 当たり前体操 これバックグラウンドでやれる？別にターミナル２個開いてもいいんだけど developみたいなコマンド作って同時実行できるかな
2022-09-24 13:19:51
日傘@5/5東7K04a
@pallasoul
ざっくり形ができました これだとプレビューとPDFの表示に差は無い感じですね？ 改行反映させるにはエンター２回なのが気になります 直せないかな あとページ数だな～ ページごとに別テーマ反映確かできますよね…？ とりあえず今のままでページ数までいってみますか pic.twitter.com/yLOZnpFcZ4
2022-09-24 13:51:16
拡大
日傘@5/5東7K04a
@pallasoul
ノンブルがそのままだと横に倒れるので、それを防止するためにノンブルに対して文字方向を設定すればいいのかなと思ったらできた 文字方向についてはここを参照 正攻法かは分からん developer.mozilla.org/ja/docs/Web/CS…
2022-09-24 14:14:20
日傘@5/5東7K04a
@pallasoul
ページの全体設定を削除したついでにページのサイズ設定も削除してたみたい うっかり案件です… というわけでとりあえず納得いく感じにできた ページごとに縦書きと横書き変えるのが結構大変だけど、普通は縦書きの本は全文縦書きなので私のやり方のほうが珍しいだけですね pic.twitter.com/8UfjuATNkY
2022-09-24 16:45:40
拡大
拡大
日傘@5/5東7K04a
@pallasoul
結局md表記なので改行するために\つけたりしないといけないのと、冒頭行空けとか１行空白とかがスッゲ～～～～～めんどい 今回はh1とかh2の見出しを ・文字サイズ本文と同じ ・文字色を透明 ・行間100~n% とかにして、見えないバカデカ行間見出しを入れることで対処しました
2022-09-24 16:47:50
日傘@5/5東7K04a
@pallasoul
サイト（dokuwiki）に上げてるのは追加プラグインで入力をほぼそのまま出力にしてるので大分ラクなんですよね。行空けは強制改行（\\）入れないとダメなんだけど、段落ごとの改行はxbrプラグインというプラグインで自動反映させてくれるので。 なのでサイトのテキストそのままは無理だった～
2022-09-24 16:49:09
日傘@5/5東7K04a
@pallasoul
サイト（dokuwiki）に上げてるのは追加プラグインで入力をほぼそのまま出力にしてるので大分ラクなんですよね。行空けは強制改行（\\）入れないとダメなんだけど、段落ごとの改行はxbrプラグインというプラグインで自動反映させてくれるので。 なのでサイトのテキストそのままは無理だった～
2022-09-24 16:49:09
日傘@5/5東7K04a
@pallasoul
本文を書きながら（創作しながら）PDF作成はマークダウン記法慣れてる人ならイケます 私は書きながら余計な記号入れるのが死ぬほど嫌なので、プレーンテキスト書き→マークダウン書式変換の手順を踏む必要がありますが、
2022-09-24 16:51:27
日傘@5/5東7K04a
@pallasoul
本文を書きながら（創作しながら）PDF作成はマークダウン記法慣れてる人ならイケます 私は書きながら余計な記号入れるのが死ぬほど嫌なので、プレーンテキスト書き→マークダウン書式変換の手順を踏む必要がありますが、
2022-09-24 16:51:27
日傘@5/5東7K04a
@pallasoul
旧サイト時代にテキスト→br改行入れするpythonコード書いたのがあるので、これをちょっといじればmdファイルにまで変換もやってくれるから楽 フォルダ一括でできるし もともとテキストで書く→推敲する→Wordとかに流し込む→レイアウト調整→最終推敲→完成というフローで作業を進めるタイプなので
2022-09-24 16:53:20
日傘@5/5東7K04a
@pallasoul
旧サイト時代にテキスト→br改行入れするpythonコード書いたのがあるので、これをちょっといじればmdファイルにまで変換もやってくれるから楽 フォルダ一括でできるし もともとテキストで書く→推敲する→Wordとかに流し込む→レイアウト調整→最終推敲→完成というフローで作業を進めるタイプなので
2022-09-24 16:53:20
日傘@5/5東7K04a
@pallasoul
マークダウン化することによる手間は無いものとして見れます なので次の縦書き本はVivliostyleで作ってみようかな～と思います B6縦書きマージン付きで、cssいじってマージン部分にライン引いてトンボ表示もできそうだし、結構いいかも
2022-09-24 16:54:41
日傘@5/5東7K04a
@pallasoul
マークダウン化することによる手間は無いものとして見れます なので次の縦書き本はVivliostyleで作ってみようかな～と思います B6縦書きマージン付きで、cssいじってマージン部分にライン引いてトンボ表示もできそうだし、結構いいかも
2022-09-24 16:54:41