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
22
0

Vue CLI v4

Avatar for Kaneko Takeshi

Kaneko Takeshi

October 25, 2019

More Decks by Kaneko Takeshi

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

Other Decks in Technology

See All in Technology
OCI技術資料 : ロード・バランサ 概要 - FLB・NLB共通
Avatar for Oracle Cloud Infrastructure ソリューション・エンジニア ocise
4
27k
Cursor Subagentsはいいぞ
Avatar for Yuji Yamaguchi yug1224
2
140
ハーネスエンジニアリング×AI適応開発
Avatar for Ryohei Kamiya aictokamiya
3
1.5k
サイボウズ 開発本部採用ピッチ / Cybozu Engineer Recruit
Avatar for Cybozu cybozuinsideout
PRO
10
77k
Even G2 クイックスタートガイド（日本語版）
Avatar for vrshinobi vrshinobi1
0
200
GitHub Advanced Security × Defender for Cloudで開発とSecOpsのサイロを超える: コードとクラウドをつなぐ、開発プラットフォームのセキュリティ
Avatar for yuriemori yuriemori
1
130
AI時代のシステム開発者の仕事_20260328
Avatar for 閃利㈱河村 純 sengtor
0
330
ブラックボックス化したMLシステムのVertex AI移行 / mlops_community_62
Avatar for Visional Engineering ＆ Design visional_engineering_and_design
1
280
AIがコードを書く時代の ジェネレーティブプログラミング
Avatar for polidog polidog
PRO
2
210
JSTQB Expert Levelシラバス 「テストマネジメント」日本語版のご紹介
Avatar for ymty ymty
0
120
40代からのアウトプット ― 経験は価値ある学びに変わる / 20260404 Naoki Takahashi
Avatar for SHIFT EVOLVE shift_evolve
PRO
5
830
OPENLOGI Company Profile
Avatar for OPENLOGI hr01
0
83k

Featured

See All Featured
So, you think you're a good person
Avatar for Per Axbom axbom
PRO
2
2k
Have SEOs Ruined the Internet? - User Awareness of SEO in 2025
Avatar for Akash Hashmi akashhashmi
0
310
The Anti-SEO Checklist Checklist. Pubcon Cyber Week
Avatar for Ryan Jones ryanjones
0
110
Claude Code どこまでも/ Claude Code Everywhere
Avatar for nwiizo nwiizo
64
54k
<Decoding/> the Language of Devs - We Love SEO 2024
Avatar for Nikki Halliwell nikkihalliwell
1
180
Data-driven link building: lessons from a $708K investment (BrightonSEO talk)
Avatar for Szymon Słowik szymonslowik
1
990
Color Theory Basics | Prateek | Gurzu
Avatar for Gurzu gurzu
0
280
A Tale of Four Properties
Avatar for Chris Coyier chriscoyier
163
24k
Between Models and Reality
Avatar for mayunak mayunak
3
260
brightonSEO & MeasureFest 2025 - Christian Goodrich - Winning strategies for Black Friday CRO & PPC
Avatar for Christian Goodrich cargoodrich
3
140
How to train your dragon (web standard)
Avatar for Monica Dinculescu notwaldorf
97
6.6k
The AI Search Optimization Roadmap by Aleyda Solis
Avatar for Aleyda Solis aleyda
1
5.6k

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もできるよ