Vue CLI
Creating a Vue project...
Previously
vue init
The good old'
Reduce configuration work
vue init
Getting started as fast as possible
Templates
webpack
webpack-simple
browserify
browserify-simple
simple
vue init
?
Lots of templates
vue init
(but you can't combine them easily)
Only a scaffolding tool
vue init
(with late prototyping experiments)
Eject-only
vue init
(you are left on your own)
Difficult upgrades
vue init
(for your app and for template forks)
Enter the next best thing...
Vue CLI 3.0
More than 6 months in the making
(out now!)
yarn global add @vue/cli
yarn global remove vue-cli
Install it now!
How is it different?
A complete rewrite from scratch
An entirely new architecture based on plugins
A powerful and extensive API
Why Vue CLI 3.0?
Reduce configuration fatigue
Mix all kind of tools together
Include best practices
The Ultimate Objective...
The standard build toolchain for Vue
Vue CLI 3.0
Feature-rich
vue create
Built-in
zero-config
fully-featured
Webpack 4
Babel 7
PostCSS
SASS
Stylus
LESS
Auto-generated HTML
Modern mode
Multi-page support
Library target
Web component target
All of this...
Out-of-the-box!
No Template
PLUGINS
Pick
the additional features
you want...
Typescript
ESLint/TSLint/Prettier
Vue Router
Vuex
PWA
Want to write
tests?
Cypress
Jest
Mocha
Nightwatch
Save your selection into presets and share them with the World!
Add new features after project creation
Plugins can be upgraded thus upgrading the app
vue create
is not the end of the story...
vue create
Source code
@vue/cli-service
plugins
Generators
Your project
vue-cli-service <command>
@vue/cli-service
@vue/cli-plugin-typescript
@vue/cli-plugin-eslint
@vue/cli-plugin-pwa
Your project
Creation
Development
Production build
Deployment
...
Zero-config by default
Configure and customize if needed
No need to eject!
In a hurry?
Instant Prototyping
vue serve MyApp.vue
vue build MyApp.vue
Something is still missing?
Community plugins
130+ plugins already available
Create your own!
Generator API
Service API
Prompts API
Read the Docs
One more thing...
Vue CLI
UI
But CLI is "Command Line Interface"?!?
Vue CLI 3.0 is more complex
More choices
More commands
More options
But we still shoot for
Ease of Access
with simple-to-use tools
So let's
Interfacize
(thanks, @Compulves)
Everything
More context
Detailed explanations
Discoverability
Better prompts UI
Localization
I started with a UI framework
yarn add @vue/ui
Homogeneous look-and-feel for Vue org apps
And after a few months of work...
vue ui
Graphical User Interface (web app)
Node.js GraphQL Server
No
electron
needed
That's not all...
UI Plugin API
Configuration
Task
Page
Suggestion
Custom components
Shared data
Actions
Hooks
What's next?
Babel 7.0 updates
vue upgrade
Better error overlay
Settings page
Command box and keyboard shortcuts
Global UI Plugins
Some secret features
More info
cli.vuejs.org
Your logo here
Guillaume Chau
@Akryum
github.com/Akryum
Thank you!
Vue CLI