Nuxt.jsを使って開発してるけど、 よく使う処理やUIコンポーネントをライブラリ化したい。。 とはいえ、公開できるレベルまで作り込む感じでもないので、 npmjs.comに公開するのは気が引ける。。 GitHub Packagesを使えば、非公開パッケージを用意できるっぽ…

Vee-Validate v4を試したときに、 validationルールでYupを利用したけど、 メッセージが英語だったので、日本語化してみたときの備忘録。 www.memory-lovers.blog pocka/yup-locale-jaを使えばOKだった(*´ω｀*) 使い方 まずはインストール $ npm i yup yup-l…

Vee-Validate3を使ってたけど、Vue3を利用しているので、 Vue3対応版のVee-Validate4を試してみたときに備忘録。 かなり変わっているので、びっくりする(*´ω｀*) 主な変更点 ValidationProviderなどで囲わなくなり、 Form、Fieldなどのコンポーネントが提供…

Tailwindでは、カスタムCSSを@applyやlg:などでも使えるように、 @layer utilitiesなどを使って設定が必要。 @tailwind base; @tailwind components; @tailwind utilities; @layer components { .select2-dropdown { @apply rounded-b-lg shadow-md; } } @la…

git tagで最新のバージョンを確認してるけど、 昇順なのがめんどくさい。。 と思ったら、並び替えできるよう(*´ω｀*) # 昇順で表示 $ git tag --sort v:refname # 降順で表示 $ git tag --sort -v:refname # デフォルトの並び順を降順に設定 $ git config --…

Nuxt2+Buefyで開発していたけど、BuefyがVue3をサポートしないっぽい。。 なので、移行先としてTailsind CSSを考えている。 いきなり全部の移行は難しいので、BuefyとTailwind3が同居できる環境を整える。 Nuxt3では試してみたけど、Nuxt2+Buefyだとちょっと…

一部のページはNuxt Contentを使っているけど、 GitHub Actionsでデプロイするようにしたら、作成日などがデプロイした日時になってるよう。。 ファイルの日時を見ているので、チェックアウトした日時になってしまうらしい。。 いろいろ調べてみると、Gitの…

一部のアニメーションでLottieを使っているけど、 軽量版があるっぽいので試してみた(*´ω｀*) もとのコンポーネントはこの記事のやつ。 www.memory-lovers.blog 軽量版を利用したコンポーネント <template> <div :style="style" ref="LottieView" /> </template> <script lang="ts"> - import lottie, { AnimationItem } from "lottie-web"; …

npmでauto completeを有効にする設定があるらしい。。(*´ω｀*) $ npm completion >> ~/.bashrc 知らなかった。。(*´ω｀*) 参考にしたサイト様 npm run + Tabキーでnpm scriptを補完する - dackdive's blog

ページ内の移動には、vue-scrolltoを使ってたけど、 vue-routerだけでもいけそうだったのでためしてみた(*´ω｀*) ちなみに、Nuxt2での設定。 簡単な使い方 nuxt.config.tsのrouter.scrollBehaviorに設定を加えると、 いろいろ振る舞いを変えれるらしい(*´ω｀…