Electronで最強のニコニコ生放送のコメントビューアを作り始めた

Electronでコメントビューアを作り始めた。本当に作り始めで、まだ諸々のビルドとか基本的なファイル構成、Chromeからセッションを抜くところまでしかできてません。最小構成の紹介として役立てればなと思います。そしておそらくMacでしか動かないですが、今後Windowsにも対応します

github.com

他のコメントビューア状況ですが、Windowsでは多くの生主が使ってるコメントビューアが存在してて、ほとんどの人がこれを使っていると言っても過言ではないと思います。

www.posite-c.com

一方Macではスタンダードと呼べるコメントビューアはないので作ろうと言いたかったのですが、2015年にMac専用の良さそうなコメントビューアができてたっぽいです。

honishi.github.io

このコメントビューアを放送で見ることはあまりないのですが、そもそも生主でMacを所有している人があまりいないですかね。そんなことは気にせずに最強のコメントビューアを作ろうと思います。

使用した技術は、主にBabel、webpackとか、webpack-dev-serverです。sqlite3も使ってるんですが、これはニコニコはセッション数が限られていて、他のコメントビューアでもおなじみなんですが、既存のログインセッションを使うためにChromeのCookieを抜く必要があって、ChromeのCookieがsqliteで保存されているからです。のちのち何か他の用途で使うかもしれませんが

以下今までで得た知見です

ファイル構成

Electron、色々なアプリを見回って参考にさせてもらいましたが，今はこの構成に落ち着いていて、気に入っている

https://github.com/tsuwatch/nicomentron/tree/b9979ef92f51f58f4bea44641f06ec2bac60151b/src

ネイティブモジュールのビルド

sqlite3をElectron（+ webpack）で使うのに結構苦労した覚えがあって、Electron用のsqlite3モジュールにしないといけないのだけど、色々調べつつnode-gypとか色々設定したりしたが、結局ここに書いてあるelectron-rebuildの方法で特に特殊なことをすることなくシュッと使えたので、electron-rebuildするのが良い

electron/using-native-node-modules.md at master · electron/electron · GitHub

./node_modules/bin/electron-rebuild sqlite3 すると、今のElectronのバージョンに合わせたsqlite3のbindingを生成してくれるさらにwebpack使うのであればexternalsに指定しないといけない。うまく使えないなぁと思っていたら、webpack側にも問題があってexternalsに指定してなかったから何かうまくいってなかったように見えたのかなと思います。keytarモジュールも同様です

https://github.com/tsuwatch/nicomentron/blob/master/webpack.config.base.js#L21-L23

https://github.com/tsuwatch/nicomentron/blob/master/package.json#L9