Vue CLI3 Tutorial #1 - Introduction

Key Takeaways

or rather than ganks of now view have released a new version of the CLI version 3 and that comes with some improvements and many new features so first of all what we'll do is a rundown of the most noticeable new features then we'll dive in and take a look at each one in more detail so the first noticeable different thing using the view CLI 3 is how we actually create a project so with the old CLI this is how we do it would save you in it then we choose a template for example webpack simple then we'd give our up a name and this would lock us into this template right here now the old CLI offered for pre-made templates each one with its own web configuration and this was one of them right here but the new CLI allows us to customize our setup with a bit more flexibility to choose exactly the features we need and the way we create an application now using the VC is by same view create and then the application name so no longer do we say the template we don't use templates anymore instead when we create this we're going to get thrown up two different options we can either use a default preset which comes with a couple of features yes links and Babel or we can create our own custom preset and add extra features to our view applications set up for example view X the view router progressive web app support etc now once we've created our projects view still abstracts the web pack configuration file away from us and by that I mean it hides it but it doesn't lock us into a premade template right before we can make edits and tweaks to the web pack config through a view config J's file and we can also edit the config indirectly with the use of plugins we can add these anytime in the future so this use of plugins now allows us to easily edit the configuration of our project at any point during development without having to manually go into the web part file and configure things ourselves and that's pretty awesome so this new plugin approach easily allows us to extend the functionality of our project setup at any point for example if we wanted to add a beautify to our project we could easily add the v2 five plug-in to do that now plugins are pretty much live dependencies but they can also edit our web pack config file and source files too and they can also add extra commands to the CLI and we're going to see all of this later on when we talk more about plugins another cool feature that comes with the new CLI is something called instant prototyping an instant prototyping basically allows us to instantly or rapidly prototype a single standalone component so say for example I've got an idea for a new component and I want to independently test that out I could use instant prototyping to do that very quickly without having to set up a whole project to do that and we'll take a look at doing this ourselves later on and finally the new CLI comes shipped with a nice graphical user interface or GUI which makes it really simple to create new projects manage plugins dependencies and project options so then in this chapter I'll be walking you through each one of these new features in the new CLI so first up let's see how to install the new CLI and create a new project with it you