Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Nuxt v2からv3へのマイグレーション
Search
kubotak
November 30, 2021
Programming
0
990
Nuxt v2からv3へのマイグレーション
Nuxt道場参面@11/25
kubotak
November 30, 2021
Tweet
Share
More Decks by kubotak
See All by kubotak
DMARCレポート可視化ツールを SvelteKitで作った話
kubotak
2
350
Superforms本番投入で分かった良さとハマりどころ
kubotak
0
440
Storybookを書くだけでリグレッションテストが 実行される世界へようこそ
kubotak
31
9.8k
(うまくいった||いかなかった) 技術選定は何を考えていたか
kubotak
1
920
ウォーターフォールに思えたプロジェクトにあったアジャイルの要素
kubotak
2
630
Felteで作る簡単フォームバリデーション
kubotak
1
1.2k
SvelteKitを本番投入してみて
kubotak
2
1.7k
PlaywrightによるSvelteコンポーネントテスト
kubotak
0
3.3k
AWS CDKでまるっと インフラ環境をIaCしたぞ!
kubotak
0
350
Other Decks in Programming
See All in Programming
Introduction to GitOps
hwchiu
0
110
유연한 Composable 설계
l2hyunwoo
0
380
DMMプラットフォームにおけるTiDBの導入から運用まで
pospome
7
3k
Modern Angular: Renovation for Your Applications
manfredsteyer
PRO
0
140
CSC307 Lecture 09
javiergs
PRO
1
500
APIのない大学ログインWebサービスをWKWebViewとJavaScriptでアプリ化した話
akidon0000
1
330
OpenAI/Gemini APIを使って EPUBを翻訳するCLIツールをつくってみた
tomiyan
0
790
君たちはどうコードをレビューする (される) か / 大吉祥寺.pm
utgwkk
15
8.5k
CSC307 Lecture 14
javiergs
PRO
0
220
Namespace on read
tagomoris
2
370
SRE チーム立ち上げ前に考えたこと・取り組んだこと / Considerations and Preparations Before Establishing an SRE Team
mackey0225
3
320
Clean Architecture by TypeScript & NestJS
ryounasso
0
150
Featured
See All Featured
BBQ
matthewcrist
82
9k
Intergalactic Javascript Robots from Outer Space
tanoku
266
26k
The Invisible Side of Design
smashingmag
294
50k
Done Done
chrislema
179
15k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
155
14k
Facilitating Awesome Meetings
lara
46
5.8k
Making the Leap to Tech Lead
cromwellryan
127
8.7k
Making Projects Easy
brettharned
111
5.7k
Reflections from 52 weeks, 52 projects
jeffersonlam
346
19k
Designing for humans not robots
tammielis
247
25k
Designing Experiences People Love
moore
136
23k
Designing on Purpose - Digital PM Summit 2013
jponch
113
6.6k
Transcript
Copyright© M&A Nuxt v 2 v 3 Nuxt @Kenjiro Kubota
Copyright© M&A Profile kubotak-is kubotak_public kenjiro.kubota M&A (Java|Type)Script PHP https://kubotak.page
Copyright© M&A M&A 3 ങ͍ख ɾҊ݅ใुM&AޭใुͷΈ ɾ࠷खྉͳ͠ ɾചΓखιʔγϯάͷνϟωϧ͕૿͑Δ ɾM&AχʔζΛൃ৴͢Δ͚ͩͰചΓखΛू٬ ɾհۀऀΛհͣ͞ʹμΠϨΫτʹΓऔΓՄೳ
ɾજࡏʹϦʔν͕Մೳ खྉແྉ ※ϓϥοτϑΥʔϜҊ݅ͷ߹ ※ ചΓख 1.ܝࡌ͢Δ ɾങ͍खͷM&AχʔζΛࣗΒௐΔ͜ͱ͕Մೳ ɾհۀऀΛհͣ͞ʹμΠϨΫτʹΓऔΓՄೳ ɾങ͍खͷM&A୲ऀʹίϯλΫτΛͱΕΔ ɾհۀऀΛΘͳ͍ͷͰखྉ͕ແྉ 2.ΦϑΝʔ͢Δ M&Aɾग़ࢿχʔζΛܝࡌ ങ͍खͷϝϦοτ ചΓखͷϝϦοτ ɾհۀऀΛΘͳ͍ͷͰखྉ͕ແྉ ʓʓྖҬͷձࣾΛ ืू͠·͢ ͜ͷձࣾͱҰॹʹ ͍͖͍ͬͯͨʂ 3 PR
Copyright© M&A Nuxt v 2 v 3 4
Copyright© M&A Nuxt v 2 5
Copyright© M&A Nuxt v 2 6 TypeScript Nuxt TypeScript
Copyright© M&A Nuxt v 2 7
Copyright© M&A 8
Copyright© M&A OpenWeather API 9 Free API https://openweathermap.org
Copyright© M&A OpenWeather API 10 API weather[ 0 ].icon URL
Copyright© M&A API Client 11 @aspida/axios
Copyright© M&A 12 TS Vetur this
Copyright© M&A 13 Vue v 2 TS Nuxt Composition API
nuxt.config.js
Copyright© M&A 14 SCF defineComponent export Composition API
Copyright© M&A 15
Copyright© M&A v 3 16
Copyright© M&A 17 Nuxt v 2 ⾒ Nuxt Bridge
Copyright© M&A 18 Nuxt 3 v 2 v 3 Nuxt
Bridge v 3
Copyright© M&A v 3 19 Nuxt Bridge
Copyright© M&A Nuxt Bridge 20 package.json &package-lock.json @nuxt/bridge
Copyright© M&A Nuxt Bridge 21 npm script nuxt nuxi generate
⾒ nuxt.config.js target: static
Copyright© M&A Nuxt Bridge 22 nuxt.config.js defineNuxtConfig export nuxt.config.(ts)
Copyright© M&A Nuxt Bridge 23 tsconfig.json
Copyright© M&A Nuxt Bridge 24 https://v 3 .nuxtjs.org/getting-started/bridge-composition-api @nuxtjs/composition-api ⾒
nuxt-bridge Composition API
Copyright© M&A Nuxt Bridge 25 https://v 3 .nuxtjs.org/getting-started/bridge-composition-api composition-api #app
Copyright© M&A Nuxt Bridge 26
Copyright© M&A Nuxt Bridge 27 TypeScript
Copyright© M&A Nuxt Bridge 28 npm run dev
Copyright© M&A 2 29 Vue 3 Vetur
Copyright© M&A Nuxt Bridge v 3 30
Copyright© M&A Nuxt v 3 31 Nuxt 3
Copyright© M&A Nuxt v 3 32 nuxt-edge nuxt 3 Nuxt
Bridge
Copyright© M&A Nuxt v 3 33 nuxt.config.ts defineNuxtConfig
Copyright© M&A Nuxt v 3 34 npm run dev SSR
SPA ssr: true
Copyright© M&A Nuxt v 3 35 CompositionAPI Auto Import
Copyright© M&A Nuxt v 3 36 npm run dev Vite
WARN
Copyright© M&A Nuxt v 3 37
Copyright© M&A 3 38 Vetur
Copyright© M&A 39 Nuxt 3 Nuxt Bridge package-lock.json Nuxt Bridge
Vue 2 Vue 3 Nuxt 3 Vite Vetur
Copyright© M&A thanks for watching this:)