Nuxtjs

概要 nuxt3-leafletで、指定したマーカーを前面に表示する方法に関する備忘録です。 方法 以下のように、LMarkerにz-index-offset属性を用いることで、指定したマーカーを前面に表示することができました。 < t e m / p < t l L / e a M @ : : < < L m t a c l z L / L M p e r l a - T { L I : : : : : s : : / a l k i t i o { T c i i i p t h s s L r a e c - n o o o c c c o o a h h I k t - r k l d l m o n o o o p o d a a c e e f = n e t a l n n n u l o d d o r > o " g x i r t U S A p t w o o n > r s = - p k i r i n A i U w w > = e " o > e p l z c n p r S A " l [ f r > = e h c A l i n m e m f . " = o h n = z c a c a s t m " r o c " e h r t r e i a [ = r h h = o k M k t t r 2 " = o t " r e a e = l k 5 [ " r t [ = r r r " e e , 1 [ = p 4 " k . s r 2 1 " s 1 [ i e l e } . 4 , , [ : , 1 n r a l } i 1 1 / 2 ( t e c ] 4 - 6 / 4 , m m , c o " 1 3 , e 1 a a t n ] 4 s ] 4 r r m e " " ] - m " 1 k k a d " 2 . ] e e r S 8 s " r r k p ] h s ) e o " / " " r t l > . I e l d a n f g = l ] = e " = t @ m 1 a . r 9 k . e 2 r / . d i i d s t ? / i 1 m 0 a 0 g 0 e s : / m 0 a " r k e r - s h a d o w . p n g " まとめ nuxt3-leafletの利用にあたり、参考になりましたら幸いです。 ...

Nuxt3のSSRをVercelでホスティングする機会がありましたので、その備忘録です。 ビルド設定について、以下のように、Output Directoryを.output/serverに設定する必要がありました。 またCORSを有効化するにあたり、以下の記事が参考になりました。 https://vercel.com/guides/how-to-enable-cors 具体的には、プロジェクトのルートに以下のフォルダを置くことで対応できました。 { } " ] h e { } a d " " ] e s h r o e { { { { s u a " r d " " " " : c e k k k k e r e e e e [ " s y y y y : " " " " " : : : : : " / [ " " " " a A A A A p c c c c i c c c c / e e e e ( s s s s . s s s s * - - - - ) C C C C " o o o o , n n n n t t t t r r r r o o o o l l l l - - - - A A A A l l l l l l l l o o o o w w w w - - - - C O M H r r e e e i t a d g h d e i o e n n d r t " s s i , " " a , , l " s v " " " a v v , l a a u l l " e u u v " e e a : " " l : : u " e * " " " " G X : E - } T C " , , S t O R r P F u T - e I T " O o N k } S e , , n P , A T X C - H R , e D q E u L e E s T t E e , d P - O W S i T t , h P , U T A " c c } e , p t , A c c e p t - V e r s i o n , C o n t e n t - L e n g t h , C o n t e n t - M D 5 , C o n t e n t - T y p e , D a t e , X - A p i - V e r s i o n " } 間違った記述もあるかもしれませんが、参考になりましたら幸いです。 ...

Babylon.jsとNuxt3とVuetifyを組み合わせて使用する機会がありましたので、その備忘録です。 構築したサイトは以下でご確認いただけます。 https://nakamura196.github.io/nuxt3-babylonjs/ ソースコードは以下です。 https://github.com/nakamura196/nuxt3-babylonjs 今回の組み合わせでアプリを開発される際の参考になりましたら幸いです。

概要 Nuxt3のssrでIIIF viewerを導入する方法の備忘録です。 Canvas Panel 以下のビューアの導入です。 https://iiif-canvas-panel.netlify.app/ インストール n p m i @ d i g i r a t i / c a n v a s - p a n e l - w e b - c o m p o n e n t s page 以下を参考にしてください。 https://github.com/nakamura196/nuxt3-iiif-viewer/blob/main/pages/canvas-panel/index.vue 表示例 https://nakamura196.github.io/nuxt3-iiif-viewer/canvas-panel Tify 以下のビューアの導入です。 https://github.com/tify-iiif-viewer/tify インストール n p m i t i f y page 以下を参考にしてください。 ...

以下に説明がありました。 https://develop365.gitlab.io/nuxtjs-2.8.X-doc/ja/api/configuration-watch/ e } x p g } w o e , a r . n f t t , e a c r l h d a l : e t b f e a [ a : c ' u k s l { : t t a t t { r i u c e ' , ] , 上記のように、nuxt.config.jsファイルでwatchを与えることで、対象ディレクトリも監視対象になりました。 ...