📰2024年30週 Weekly Report

# 🏆MVP ## pnpm移行 [[npm]]のプロジェクトを[[pnpm]]に移行した。 <div class="link-card"> <div class="link-card-header"> <img src="https://publish-01.obsidian.md/access/35d05cd1bf5cc500e11cc8ba57daaf88/favicon-64.png" class="link-card-site-icon"/> <span class="link-card-site-name">minerva.mamansoft.net</span> </div> <div class="link-card-body"> <div class="link-card-content"> <p class="link-card-title">📜2024-07-28 Various Complementsをnpmからpnpmに移行する</p> <p class="link-card-description">久々にpnpmを試してみたらいい感じだったので、Bunを使えないプロジェクトで実際に試してみたくなった。</p> </div> <img src="https://publish-01.obsidian.md/access/35d05cd1bf5cc500e11cc8ba57daaf88/Notes/attachments/activity.webp" class="link-card-image" /> </div> <a class="internal-link" data-href="Notes/📜2024-07-28 Various Complementsをnpmからpnpmに移行する.md"></a> </div> %%[[📜2024-07-28 Various Complementsをnpmからpnpmに移行する]]%% [[pnpm]]に移行した主な理由は以下5点。 - [[Ubuntu 22.04 LTS(Jammy Jellyfish)|Ubuntu 22]] on [[WSL]]環境で`npm install`で[[Vue]]や[[Nuxt]]をインストールしようとすると、なぜか100%ローディング状態のままフリーズするから - 一度プロセス終了して再実行すると成功する (謎) - [[pnpm]]の方が高速だし使いやすそうだから - [[corepack]]により[[pnpm]]の導入が簡単であり、[[corepack]]自身も[[Node.js]]にバンドルされているから - 以前に[[pnpm]]へ移行しなかったのは[[Windows]]特有の問題によるものだったから - [[📜Windows11でpnpmを動かしてみた]] 参照 - [[Jest]]が動かなかったのは `@jest/globals` をインストールしていなかったため - [[npm]]だとパッケージがフラット構成ではなかったので、別ライブラリの依存に`@jest/globals`が含まれており、それで解決した - [[📝Jest x TypeScriptでpnpm利用時に@jest globalsからimportできない]] - [[Bun]]だと[[Node.js]]から移行しきれない部分がどうしても存在するから - 仕事のプロダクション環境で使うのは互換性やメンテの面から少し怖い今のところ総じて快適😊 # 🥈RUP ## Zellijを試してみたちょうど職場で[[Vim]]に関するLTを開催し、その中で[[tmux]]の話題が少し出た。[[Ubuntu 22.04 LTS(Jammy Jellyfish)|Ubuntu 22]] on [[WSL]] 環境の身としては[[ターミナルマルチプレクサ]]の利用はデメリットの方が大きかったため、6年前くらいから使うのをやめていた。そんな折に最近[[Neovim]]に移行したとの噂の[[👤David Heinemeir Hansson|DHH]]氏に関する記事が。 <div class="link-card"> <div class="link-card-header"> <img src="https://omakub.org/assets/images/favicon.png" class="link-card-site-icon"/> <span class="link-card-site-name">Omakub</span> </div> <div class="link-card-body"> <div class="link-card-content"> <p class="link-card-title">Omakub</p> <p class="link-card-description">Turn a fresh Ubuntu installation into a fully-configured, beautiful, and modern web development system by running a single command.</p> </div> <img src="https://omakub.org/assets/images/opengraph.png" class="link-card-image" /> </div> <a href="https://omakub.org/"></a> </div> その中で[[tmux]]のモダン実装である[[Zellij]]について紹介されていたので気になって使ってみることにした。 <div class="link-card"> <div class="link-card-header"> <img src="https://publish-01.obsidian.md/access/35d05cd1bf5cc500e11cc8ba57daaf88/favicon-64.png" class="link-card-site-icon"/> <span class="link-card-site-name">minerva.mamansoft.net</span> </div> <div class="link-card-body"> <div class="link-card-content"> <p class="link-card-title">📜2024-07-27 Zellijを使ってみる</p> <p class="link-card-description">DHH氏が最近Neovimに移行したという話は聞いていたが、OMAKUBというUbuntu 24用のセットアップスクリプトを公開しており、その中でZellijの言及があったため気になったから。</p> </div> <img src="https://publish-01.obsidian.md/access/35d05cd1bf5cc500e11cc8ba57daaf88/Notes/attachments/activity.webp" class="link-card-image" /> </div> <a class="internal-link" data-href="Notes/📜2024-07-27 Zellijを使ってみる.md"></a> </div> %%[[📜2024-07-27 Zellijを使ってみる]]%% [[tmux]]と比べて明らかな使いやすさを感じつつも、結論として見送ることにした。詳細は上記を見てほしい。 # 🪙OPA ## サブモニタ MB16ACV の導入職場にサブモニタとして[[MB16ACV]]を導入した。 <div class="link-card"> <div class="link-card-header"> <img src="https://www.asus.com/new_asus_ico_256x256.png" class="link-card-site-icon"/> <span class="link-card-site-name">ASUS 日本</span> </div> <div class="link-card-body"> <div class="link-card-content"> <p class="link-card-title"></p> <p class="link-card-description">ZenScreenポータブルモニターは、生産性を高め、外出先でのエンターテインメントを可能にするように設計されています。コンパクトで用途が広く、どこにいて簡単に使用することができます。</p> </div> <img src="https://dlcdnwebimgs.asus.com/gain/46eb53b8-5414-48af-bc7b-43917e826def/" class="link-card-image" /> </div> <a href="https://www.asus.com/jp/displays-desktops/monitors/zenscreen/zenscreen-mb16acv/"></a> </div> 買い替えの理由は、10年くらい前に購入した、同じくASUSのポータブルモニタが故障してしまったためだ。故障したモニタも一昔前の製品であることから発色に難があり、個人的にはずっと買い替えたかった... がある制約が満たせずに今日まで使い続けていた。その制約とは **[[USB Type-A]] かつそれ以外の外部給電なし** で使えること。[[USB Type-C]]が全盛期の令和においては非常に厳しい制約である... が会社のPCは[[USB Type-C]]が2つしかないため、その条件は妥協できなかった。([[USB Type-C]]はDELLのウルトラワイドモニタおよび ACアダプタで埋まっていた) <div class="link-card"> <div class="link-card-header"> <img src="https://publish-01.obsidian.md/access/35d05cd1bf5cc500e11cc8ba57daaf88/favicon-64.png" class="link-card-site-icon"/> <span class="link-card-site-name">minerva.mamansoft.net</span> </div> <div class="link-card-body"> <div class="link-card-content"> <p class="link-card-title">📜2024-07-25 MB16ACVをUSB Type-Aで動かしてみる</p> <p class="link-card-description">MB16ACVが届いたのでUSB Type-Aで動くか確かめてみる。</p> </div> <img src="https://publish-01.obsidian.md/access/35d05cd1bf5cc500e11cc8ba57daaf88/Notes/attachments/activity.webp" class="link-card-image" /> </div> <a class="internal-link" data-href="Notes/📜2024-07-25 MB16ACVをUSB Type-Aで動かしてみる.md"></a> </div> %%[[📜2024-07-25 MB16ACVをUSB Type-Aで動かしてみる]]%% 家のPC (正確には[[FlexScan EV3895]]) に接続した際は動かなかったが、会社のPCでは無事に稼働した。ウルトラワイドモニタの下にFull HDモニタがあるというのは、やはり非常に効率が良い。購入は正解だったし、2万2000円ちょいという価格も破格だと思った。同じような状況に身を置かれている方は、迷わずポチることをオススメする👍 # 🚀Releases なし # 👀Reading ## Google、サードパーティCookie廃止方針を変更　新たなユーザー選択肢を導入へ <div class="link-card"> <div class="link-card-header"> <img src="https://www.itmedia.co.jp/favicon.ico" class="link-card-site-icon"/> <span class="link-card-site-name">ITmedia NEWS</span> </div> <div class="link-card-body"> <div class="link-card-content"> <p class="link-card-title">Google、サードパーティCookie廃止方針を変更　新たなユーザー選択肢を導入へ</p> <p class="link-card-description">Googleは、「サードパーティCookie廃止の代わりに、Chromeに新しいエクスペリエンスを導入する」と発表した。「プライバシーサンドボックス」の改良も続けるとしている。 ... </p> </div> <img src="https://image.itmedia.co.jp/news/articles/2407/23/cover_news082.jpg" class="link-card-image" /> </div> <a href="https://www.itmedia.co.jp/news/spv/2407/23/news082.html"></a> </div> ~~~ 流石に影響大きすぎるから実質断念なのかもしれないな。 https://www.itmedia.co.jp/news/spv/2407/23/news082.html ~~~ ## GitHub - numToStr/Comment.nvim: :brain: // Smart and powerful comment plugin for neovim. Supports treesitter, dot repeat, left-right/up-down motions, hooks, and more <div class="link-card"> <div class="link-card-header"> <img src="https://github.githubassets.com/favicons/favicon.svg" class="link-card-site-icon"/> <span class="link-card-site-name">GitHub</span> </div> <div class="link-card-body"> <div class="link-card-content"> <p class="link-card-title">GitHub - numToStr/Comment.nvim: :brain: // Smart and powerful comment plugin for neovim. Supports treesitter, dot repeat, left-right/up-down motions, hooks, and more</p> <p class="link-card-description">:brain: :muscle: // Smart and powerful comment plugin for neovim. Supports treesitter, dot repeat, left-right/up-down mo ... </p> </div> <img src="https://opengraph.githubassets.com/e95b06d9fe942668b403d2d7c0a7baf80414c94a48944446615b529278c5234b/numToStr/Comment.nvim" class="link-card-image" /> </div> <a href="https://github.com/numToStr/Comment.nvim"></a> </div> ~~~ Comment.nvimを導入 https://github.com/numToStr/Comment.nvim ~~~ ## feat: filetype.lua by gpanders · Pull Request #16600 · neovim/neovim <div class="link-card"> <div class="link-card-header"> <img src="https://github.githubassets.com/favicons/favicon.svg" class="link-card-site-icon"/> <span class="link-card-site-name">GitHub</span> </div> <div class="link-card-body"> <div class="link-card-content"> <p class="link-card-title">feat: filetype.lua by gpanders · Pull Request #16600 · neovim/neovim</p> <p class="link-card-description">This is a first (rough) draft of what a filetype.lua might look like. Some notes:This (currently) only support ... </p> </div> <img src="https://opengraph.githubassets.com/4ca4db8ea7ed425576c1df2ebb64323b47c2fc9e1ce23c833740612482a5a11e/neovim/neovim/pull/16600" class="link-card-image" /> </div> <a href="https://github.com/neovim/neovim/pull/16600#"></a> </div> ~~~ filetype.luaたるものが... なるほど https://github.com/neovim/neovim/pull/16600# ~~~ ## 自分が管理する全 OSS の Issue や Pull Request を 1 つの GitHub Project に集約 <div class="link-card"> <div class="link-card-header"> <img src="https://static.zenn.studio/images/logo-transparent.png" class="link-card-site-icon"/> <span class="link-card-site-name">Zenn</span> </div> <div class="link-card-body"> <div class="link-card-content"> <p class="link-card-title">自分が管理する全 OSS の Issue や Pull Request を 1 つの GitHub Project に集約</p> </div> <img src="https://res.cloudinary.com/zenn/image/upload/s--ZLpVjw8l--/c_fit%2Cg_north_west%2Cl_text:notosansjp-medium.otf_55:%25E8%2587%25AA%25E5%2588%2586%25E3%2581%258C%25E7%25AE%25A1%25E7%2590%2586%25E3%2581%2599%25E3%2582%258B%25E5%2585%25A8%2520OSS%2520%25E3%2581%25AE%2520Issue%2520%25E3%2582%2584%2520Pull%2520Request%2520%25E3%2582%2592%25201%2520%25E3%2581%25A4%25E3%2581%25AE%2520GitHub%2520Project...%2Cw_1010%2Cx_90%2Cy_100/g_south_west%2Cl_text:notosansjp-medium.otf_37:Shunsuke%2520Suzuki%2Cx_203%2Cy_121/g_south_west%2Ch_90%2Cl_fetch:aHR0cHM6Ly9saDMuZ29vZ2xldXNlcmNvbnRlbnQuY29tL2EtL0FPaDE0R2p0NzY1aTNueDRmTTFYRE1sRnluM1lYb1RmejRUMEJ6TlBZdWN2c1E9czk2LWM=%2Cr_max%2Cw_90%2Cx_87%2Cy_95/v1627283836/default/og-base-w1200-v2.png" class="link-card-image" /> </div> <a href="https://zenn.dev/shunsuke_suzuki/articles/add-github-issue-pr-to-project"></a> </div> ~~~ 今だとリポジトリごと、もしくは自分の開発物全体のIssue管理にしか使ってこなかったし、タスクは通知欄で管理してたけど、そういう方法もあるのか。 https://zenn.dev/shunsuke_suzuki/articles/add-github-issue-pr-to-project ~~~ ## GitHub - brenoprata10/nvim-highlight-colors: Highlight colors for neovim <div class="link-card"> <div class="link-card-header"> <img src="https://github.githubassets.com/favicons/favicon.svg" class="link-card-site-icon"/> <span class="link-card-site-name">GitHub</span> </div> <div class="link-card-body"> <div class="link-card-content"> <p class="link-card-title">GitHub - brenoprata10/nvim-highlight-colors: Highlight colors for neovim</p> <p class="link-card-description">Highlight colors for neovim. Contribute to brenoprata10/nvim-highlight-colors development by creating an a ... </p> </div> <img src="https://repository-images.githubusercontent.com/514820316/14566fd8-7fe6-455c-abb7-241c73bd7a4e" class="link-card-image" /> </div> <a href="https://github.com/brenoprata10/nvim-highlight-colors"></a> </div> ~~~ 気になる。 https://github.com/brenoprata10/nvim-highlight-colors ~~~ ## GitHub - zellij-org/zellij: A terminal workspace with batteries included <div class="link-card"> <div class="link-card-header"> <img src="https://github.githubassets.com/favicons/favicon.svg" class="link-card-site-icon"/> <span class="link-card-site-name">GitHub</span> </div> <div class="link-card-body"> <div class="link-card-content"> <p class="link-card-title">GitHub - zellij-org/zellij: A terminal workspace with batteries included</p> <p class="link-card-description">A terminal workspace with batteries included. Contribute to zellij-org/zellij development by creating an a ... </p> </div> <img src="https://repository-images.githubusercontent.com/292014229/b8e9df2e-3a36-4642-9e54-2edffb3a59ef" class="link-card-image" /> </div> <a href="https://github.com/zellij-org/zellij"></a> </div> ~~~ ちょっと使ってみたけど、なかなかよさそうな気がする... https://github.com/zellij-org/zellij ~~~ ## Technology | 2024 Stack Overflow Developer Survey <div class="link-card"> <div class="link-card-header"> <img src="https://survey.stackoverflow.co/2024/favicon.ico" class="link-card-site-icon"/> <span class="link-card-site-name">survey.stackoverflow.co</span> </div> <div class="link-card-body"> <div class="link-card-content"> <p class="link-card-title">Technology | 2024 Stack Overflow Developer Survey</p> </div> </div> <a href="https://survey.stackoverflow.co/2024/technology"></a> </div> ~~~ めっちや興味深いデータ。 https://survey.stackoverflow.co/2024/technology - elixirが信者が多い感じのグラフになってるのが特徴的 - Ruffがいいのはメッチャ分かる - エディタはVSCode圧勝だけど、賞賛はNeovimの方が高くてわかりみ - Obsidianがグローバルだと既にNotionと同等レベルなのがすごいな ~~~ ## すばやく実装するための戦略とテクニック2024 / speed is power! 2024 <div class="link-card"> <div class="link-card-header"> <img src="https://d1eu30co0ohy4w.cloudfront.net/assets/favicon-bdd5839d46040a50edf189174e6f7aacc8abb3aaecd56a4711cf00d820883f47.png" class="link-card-site-icon"/> <span class="link-card-site-name">Speaker Deck</span> </div> <div class="link-card-body"> <div class="link-card-content"> <p class="link-card-title">すばやく実装するための戦略とテクニック2024 / speed is power! 2024 #techramen24conf #shoyu</p> <p class="link-card-description">TechRAMEN 2024 Conferenceで発表した「すばやく実装するための戦略とテクニック2024年版」のスライドです。https:/ ... </p> </div> <img src="https://files.speakerdeck.com/presentations/8f4ba86d640146039890515c1ad22ce3/slide_0.jpg?31142740" class="link-card-image" /> </div> <a href="https://speakerdeck.com/77web/speed-is-power-2024-number-techramen2024conf-number-shoyu"></a> </div> ~~~ メッチャわかる https://speakerdeck.com/77web/speed-is-power-2024-number-techramen2024conf-number-shoyu ~~~ ## Node.jsのTypeScriptサポートについて <div class="link-card"> <div class="link-card-header"> <img src="https://github.githubassets.com/favicons/favicon.svg" class="link-card-site-icon"/> <span class="link-card-site-name">Gist</span> </div> <div class="link-card-body"> <div class="link-card-content"> <p class="link-card-title">Node.jsのTypeScriptサポートについて</p> <p class="link-card-description">Node.jsのTypeScriptサポートについて. GitHub Gist: instantly share code, notes, and snippets.</p> </div> <img src="https://github.githubassets.com/assets/gist-og-image-54fd7dc0713e.png" class="link-card-image" /> </div> <a href="https://gist.github.com/azu/ac5dafbf211ef8b5ecf386930ac75250"></a> </div> ~~~ なるほど。。。型削除だけでもいいからつかってみたい。 https://gist.github.com/azu/ac5dafbf211ef8b5ecf386930ac75250 ~~~ # 📚New Notes - [[Anker Power Bank(30W,Fusion)]] - [[Comment.nvim]] - [[MB16ACV]] - [[OMAKUB]] - [[Ubuntu 24.04 LTS(Noble Numbat)]] - [[WSL2から見たWindowsホストのIPアドレス]] - [[Zellij]] - [[corepack]] - [[gitlinker.nvim]] - [[mini.icons]] - [[nvim-highlight-colors]] - [[props (Vue)]] - [[tmux]] - [[ウィンドウを分割して複数のターミナルを表示 (toggleterm.nvim)]] - [[カスタム属性]] - [[クイックフィックスリスト (Vim)]] - [[ターミナルマルチプレクサ]] - [[ロックファイルを変換 (pnpm)]] - [[拡張子でファイルタイプを指定 (Neovim)]] - [[現在のディレクトリ配下で利用するツールを指定 (mise)]] - [[👤David Heinemeir Hansson]] - [[📕よく使うxhのコマンド]] - [[📜2024-07-25 MB16ACVをUSB Type-Aで動かしてみる]] - [[📜2024-07-27 Zellijを使ってみる]] - [[📜2024-07-28 Various Complementsをnpmからpnpmに移行する]] - [[📝Jest x TypeScriptでpnpm利用時に@jest globalsからimportできない]] - [[📝Nuxt3でimports.autoImportをfalseにしてもcomponents配下の定義にジャンプできてしまう]] - [[📝Prettier Plugin Organize Importsでvueファイルのtemplateタグ内で直接importした関数や変数を使うと自動削除の対象になってしまう]] - [[📝prettierdを実行するとprettier-plugin-organize-importsと一緒に実行するとinterfaceやtypeの型引数が消える]] - [[📰2024年29週 Weekly Report]] - [[📰2024年30週 Weekly Report]] - [[📰Neovim x VolarでNuxt3(Vue3)のtemplateを型安全に開発するための調査]]