2020-01-26

webpack

作者:山田祥寛
出版社/メーカー: WINGSプロジェクト
発売日: 2018/04/27
メディア: Kindle版

npx webpack のように npx を使うとプロジェクトローカルにインストールしたコマンドを実行できることを覚えた。

webpack.config.js に optimaization の設定を追加すると共通の js を抽出して出力できることを覚えた。

  optimization: {
    splitChunks: {
      name: 'common.js',
      chunks: 'initial',
    }
  },

webpack —mode=production で生成した共通 js のサイズが 500KB を超えている。jquery プラグインとそれに付随する画像に起因してる気がするので追跡調査が必要。bundle しないで単純にとあるファイルをとある箇所に移動したいだけの場合にどうしたらいいのか分からないので Makefile を作ってひとまずしのぐ。

2020-01-22

2020

2020 年が始まった。出だしから大きめのシステム稼働があったのでずっと出勤 (結果的に要らなかったと思う)。仕事のストレスと上司ストレスが MAX に達していたようで表面的には "何でも無い" を装って軽く流していたつもりだったのだけど休みに入ったら安心したのかアレよアレよと体調を崩して帯状疱疹発動。年始から連勤してたけどその後は連休になった。とは言ってもタイミングが良いのか悪いのか土日祝日と振替休暇(これを強制される意味がわからん。部のルールなんか知らんし。そっちの都合だろうが。強制力は無いと思うんだが無言の圧力がある。人事に相談したらいいのか？会話するのも嫌だからハイハイで振替にした)で 5 連休したあと、2日働いてその後に土日を含めて 5 連休。通院したのが早かったおかげか大きな痛みはなくたまにチクチクする程度。病名でググると結構ヤバそうな画像が並ぶのだけど右側の前と後ろにアザが残っているものの見た目ほどの痛さは感じない。椅子に座っていると背中が内側から痛い感じがあって辛いのだけど運動不足によるものなのか姿勢からくるものなのか判断がつかない(前にも何回かあったから)。神経痛が残ることがあると言われているので様子見。2019 年も通してつまんないどうでもいい感じの活動がメインだったので振り返りたくもなく、うすうす上司ともあわねーなと思っていたけどやっぱあわないわが確定したので来年度はどっかに行きたい。

休養中はある程度元気なのもあって Youtube を見続けるのも辛いので webpack と typescript に手を出してみた。収集したログを時系列で見れるようにするツールを go の echo で作っていたので webpack で js、 css、画像がパッケージングされるように修正した。

ちょっと前 (10年以上前) は 1 つの html (jsp) に必要な css と js をゴリ書きしてたし、js は名前空間無視でグローバルに関数書いてたし楽なもんだった。webpack を導入してみようと重い腰を上げてみたのはいいのだけど、まずどうしたらいいのかが分からなかった。とりあえず typescript に置き換えるのはすぐだった。拡張子を js から ts に変えて any つければいい。vim-lsp で typescript のコードを補完したりリネームしたりジャンプしたりホントに便利なったなと浸れたのは一瞬でそこからが長かった。jquery-ui で datepicker を動かすまでもよくわかなかったし、loader の仕組みで css と png を取り込むことが分かるまでも長かった。ほんとにここまでやらないといけないのかと思うぐらいに大変だ。package.json はいいとして、webpack.config.js はググれないと無理。ググっても正しいのかよく分からないけど。そう正解がよくわからない。動けばいいならいいんだけど。

なんだかんだで大変だったものの休暇を理由にまとまった自由時間が取れたことで勉強ができたので良かった。そいえば僕は internet がしたくて会社に入って、internet というか web アプリの開発ができてたことで満足できてたんだなというのを思い出した。気がついたら web っていうか dotnet というかみたいな開発が始まって、開発できてるうちは良かったんだけどどこのだれが作ったんだが作り逃げしたんだか分からないようなロジックを評価したりチューニングしたりする日々に虚しさしか感じない日々を過ごしている。リフレッシュできたので今年度残りのもうちょっと働きますけど来年度はどうしようかな。

次は

react + typescript を試したい。
だらだら思ったことをそのまま blog に落としていきたい (けど、はてなである必要ある？惰性だよねってのが最近の疑問)

2019-12-17

Inkdrop - ログインできなくなった

inkdrop

ログインの有効期間が失効していて(？)ログインできなくなっていた。 go で書いた簡単 proxy ツールを書いて経由するようにしたらログインできた。そのままだとノートの同期ができなかったので、元の proxy 設定に変えた。

proxy の id がメールアドレスで @ を含んでいるのが関係するのか？

ログインに使った通すだけのプロキシ。

package main

import (
    "log"
    "net/http"

    "github.com/elazarl/goproxy"
)

func main() {
    proxy := goproxy.NewProxyHttpServer()
    proxy.Verbose = true
    proxy.OnRequest().DoFunc(
        func(r *http.Request, ctx *goproxy.ProxyCtx) (*http.Request, *http.Response) {
            return r, nil
        })
    log.Fatal(http.ListenAndServe(":8080", proxy))
}

2019-11-17

Inkdrop に乗り換え

inkdrop

乗り換え調査

Bear が windows 対応していたら即決だった。 windows でも動いてモバイルアプリも有るものが欲しかった。

markdown をサポートしつつある evernote に本格的に乗り換えようと思ったのだけど iOS アプリが重すぎた。ページを読み込むのが遅すぎる。他のアプリに切り替えて戻ると再度読み込み直した上にスクロール位置を保持してくれない。さっとメモを追記したい場合に致命的。オフラインノートにすれば改善できるのかと思ってプレミアにしてみたのだけど変わらず。来月解除予定。

Inkdrop も候補としてずっとチラ見していたのだけど windows で動かした場合のレンダリングが厳しかった。フォントが見づらい (mac だといい感じなのだけど、mac だけなら Bear で良かった。自分でフォントを指定すれば良かっただけだったのか改善されたのか今は大丈夫)。追撃で会社 PC からログインできなかったので候補から除外していた。ところがついこの前突然ログインできるようになった(※)のを契機に乗り換えることにした。

(※) ダメ元でローカル起動の go 製 proxy を経由したら通ったのだけど、その後は通さなくても大丈夫になった。その直前にエラーが出ることを確認していなかったのでローカルプロキシが良かったのか今となっては謎。

plugin

plugin がいろいろあって面白い。 vim plugin がよくて、"やっぱこれだよな" とニヤニヤしつつ使っている。

Status

Active、On Hold、Completed、Dropped のステータスがあり、Completed にすると All Notes に出なくなる。それはいいのだけどタグを選んだ場合は表示してほしい。All Notes を inbox 方式に使おうとすると期待の動作と違う。.inbox タグをつけるようにしてもいいのだけど、そうすると Status が無駄にサイドバーの領域を取ることになってしまう。

Active ・・・現在実行中リスト
On Hold ・・・やらないとなリスト

として、対象から外れたら Status を None にする運用にしている。

スタイルを変えられる

フォント指定はもちろん、行間をデフォルトで変えられるのが嬉しい (evernote も行間が変えられるだけで印象がだいぶ変わるのだけど)。自分でスタイルを書くこともできるので、ちょろちょろいじってはニヤニヤしている (vimrc 触りに近い)。たとえばリスト記法の - を書くと class が設定されるので、文字色を変えるなり背景色を変えるなり自由にできる。## の見出しにアンダーラインを引いてみたりとか。 - をドットの画像に置き換えたいのだけどローカルのファイルを指定する方法が分かってない (url 指定はできた)。

Keyhack

ink = keymap.defineWindowKeymap( exe_name="Inkdrop.exe" )
ink["C-H"] = "Back"
ink["C-E"] = "End"
ink["C-F"] = "Right"
ink["C-B"] = "Left"
ink["C-Period"] = "C-Tab"
ink["C-Comma"] = "C-S-Tab"
ink["C-W"] = "C-S-Left","C-X"

vim plugin を入れているのでテキスト入力中は ctrl+w で手前のテキストを削除できる。しかし、windows でタイトル入力中に ctrl+w を発動すると Inkdrop ごと落ちてしまうので設定している (起動したら閉じることは無いので、本当に閉じるか聞いてほしい、か無効にしてほしい)。

AutoHotkey

ctrl+j した場合に ime を off にするためだけ。 keyhack だけで済ませたいのだけど設定が分からないので暫定。noh も発動したい。

これ以外では apple keyboard で ime on/off をするために AutoHotKey を入れている。 (かな キーで ON、英数 キーで OFF)

#IfWinActive, ahk_class Chrome_WidgetWin_1
{
  Ctrl & J::ime_off()
}

ime_off() {
    Send, {Esc}
    IME_SET(0)
}

気になるところ

Distraction Free (サイドバー全部消す) にした場合のヘッダ部が占める領域が広いのが気になる (狭い画面を使ってるせいもあるけど)。
ノートに別ウインドウで起動するボタンがほしい (共有の横辺り？) 。歴を進んだり戻ったりでノートを移動した場合に一覧(2カラム目)に対象ノートが無い場合がある。その場合はノートが一覧表示されるようにタグを選ぶなりしないといけないのが手間。頻度は低いのだけど。