Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Vue CLI v4

Avatar for Kaneko Takeshi Kaneko Takeshi
October 25, 2019
Technology
0
21

Vue CLI v4

Avatar for Kaneko Takeshi

Kaneko Takeshi

October 25, 2019
Tweet

More Decks by Kaneko Takeshi

See All by Kaneko Takeshi
オープンソースライセンスについて勉強する定期
Avatar for Kaneko Takeshi tkckaneko
0
28
Eye Tracking on the Browser
Avatar for Kaneko Takeshi tkckaneko
0
84
IEEE754を完全に理解した
Avatar for Kaneko Takeshi tkckaneko
1
75
CSSのトレンドをみんなで見よう -2021年-
Avatar for Kaneko Takeshi tkckaneko
0
92
多分これが一番早いと思います
Avatar for Kaneko Takeshi tkckaneko
0
25
暗黒面の話
Avatar for Kaneko Takeshi tkckaneko
0
23
CSR / SSR / SSG / JAMstack
Avatar for Kaneko Takeshi tkckaneko
0
68
BOLT
Avatar for Kaneko Takeshi tkckaneko
0
29
CSS Logical Properties and Values
Avatar for Kaneko Takeshi tkckaneko
0
33

Other Decks in Technology

See All in Technology
なぜインフラコードのモジュール化は難しいのか - アプリケーションコードとの本質的な違いから考える
Avatar for Gosuke Miyashita mizzy
35
10k
マイクロリブート ~ACEマインドセットで実現するアジャイル~
Avatar for ソニー株式会社 sony
0
220
Master Dataグループ紹介資料
Avatar for Sansan, Inc. sansan33
PRO
1
3.9k
嗚呼、当時の本番環境の状態で AI Agentを再評価したいなぁ...
Avatar for po3rin po3rin
0
390
3年ぶりの re:Invent 今年の意気込みと前回の振り返り
Avatar for kazzpapa3 kazzpapa3
0
190
LINE公式アカウントの技術スタックと開発の裏側
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
0
340
ステートレスなLLMでステートフルなAI agentを作る - YAPC::Fukuoka 2025
Avatar for FUJI Goro gfx
0
100
エンジニアに定年なし！ AI時代にキャリアをReboot — 学び続けて未来を創る
Avatar for JunjiKoide junjikoide
0
170
バクラクの AI-BPO を支える AI エージェント 〜とそれを支える Bet AI Guild〜
Avatar for Tomoaki tomoaki25
1
360
ubuntu-latest から ubuntu-slim へ移行しよう！コスト削減うれしい～！
Avatar for asumikam asumikam
0
460
どうなる Remix 3
Avatar for Hisateru Tanaka tanakahisateru
2
350
データ組織ゼロから投資を得るまでの軌跡と未来図 〜AIの前にやるべきこと〜 / Building a Data Organization from Scratch: The Journey to Securing Investment and a Vision for the Future
Avatar for 株式会社カオナビ kaonavi
0
120

Featured

See All Featured
Keith and Marios Guide to Fast Websites
Avatar for Keith Pitt keithpitt
413
23k
A better future with KSS
Avatar for Kyle Neath kneath
239
18k
The Straight Up "How To Draw Better" Workshop
Avatar for Dennis Kardys denniskardys
239
140k
Art, The Web, and Tiny UX
Avatar for Lynn Fisher lynnandtonic
303
21k
Principles of Awesome APIs and How to Build Them.
Avatar for Keavy McMinn keavy
127
17k
Intergalactic Javascript Robots from Outer Space
Avatar for Vicent Martí tanoku
273
27k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
Avatar for mongodb mongodb
48
9.8k
GraphQLの誤解/rethinking-graphql
Avatar for sonatard sonatard
73
11k
Six Lessons from altMBA
Avatar for Skipper Chong Warson skipperchong
29
4.1k
BBQ
Avatar for Matthew Crist matthewcrist
89
9.9k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
Avatar for Addy Osmani addyosmani
9
970
The Invisible Side of Design
Avatar for Vitaly Friedman smashingmag
302
51k

Transcript

  1. Vue CLI v4

  2. みんなが大好きVue CLIのversion 4がリリースされました

  3. Vue CLIはVue.jsでの開発環境を用意するためのツールです

  4. このバージョンでは細かく調整が入っているようです なかでも気になるところが Vue CLI v4 comes with greatly improved Nightwatch,

    Jest and PWA support, as well as many other small tweaks across all the core packages. です

  5. テストまわりとPWAのサポートが改善されたようです - UnitテストのJest - E2EテストのNightWatch - いつものPWA

  6. どこまで便利になったかご紹介します

  7. まず、Vue CLIのバージョンを上げます

  8. $ yarn global add @vue/cli ・・・ success Installed "@vue/[email protected]" with

    binaries: - vue ✨ Done in 62.80s.

  9. $ vue create my-project とすれば簡単にコマンドでVue.jsのプロジェクトが作れます

  10. $ vue ui おすすめはこちら

  11. では作っていきましょう

  12. まずプロジェクト名を決めて

  13. None

  14. プラグインを選びます

  15. None

  16. 忘れずにJest、NightWatch、PWAを入れましょう

  17. None

  18. デモ

  19. まとめ 何も設定することなく UnitテストもE2Eテストもできるようになりました ※おまけにPWAもできるよ