Book Image

Vue CLI 3 Quick Start Guide

By : Ajdin Imsirovic
Book Image

Vue CLI 3 Quick Start Guide

By: Ajdin Imsirovic

Overview of this book

The sprawling landscape of various tools in JavaScript web development is becoming overwhelming. This book will show you how Vue CLI 3 can help you take back control of the tool chain. To that end, we'll begin by configuring webpack, utilizing HMR, and using single-file .vue components. We'll also use SCSS, ECMAScript, and TypeScript. We'll unit test with Jest and perform E2E testing with Cypress. This book will show you how to configure Vue CLI as your default way of building Vue projects. You'll discover the reasons behind using webpack, babel, eslint, and other modern JavaScript toolchain technologies. You'll learn about the inner workings of each through the lens of Vue CLI 3. We'll explore the extendibility of Vue CLI with the built-in settings, and various core and third-party plugins. Vue CLI helps you work with Vue components, routers, directives, and services in the Vue ecosystem. While learning these concepts, you'll examine the evolution of JavaScript. You'll learn about use of npm, IIFEs, modules in JavaScript, Common.js modules, task runners, npm scripts, module bundlers, and webpack. You'll get familiar with the reasons why Vue CLI 3 is set up the way it is. You'll also learn to perform linting with ESLint and Prettier. Towards the end, we'll introduce you to working with styles and SCSS. Finally, we'll show you how to deploy your very own Vue project on Github Pages.
Table of Contents (10 chapters)

Preface

Vue began as a project of a single person, Evan You. It is amazing that it has gotten to the point where it is today: a contender for the spot of the favorite frontend framework, competing with the corporate-backed React and Angular.

Of course, these are not the only frontend frameworks, but the trio of Vue, React, and Angular seem to be the most popular, with the internet buzzing with comparisons of these frameworks and experiences with them. It's not uncommon to come across an article that compares Vue and React, for example, or a blog post on ten ways that Vue is better than Angular. Regardless of whether these articles are someone's opinion, or clickbait, or statement of the facts, there must be some truth to these claims.

What was the reason for Vue's success? Dedication, hard work, or luck? Probably a bit of each. But another key to Vue's success was Evan's obvious priority of making things easy for the developer. Vue's no longer developed by a single person, but it is still very approachable. The community has kept the gist of what Vue was all about from the beginning: an easy-to-use framework that gets out of your way and just lets you code.

Vue CLI is another example of this. Besides a command-line interface that's up to par with other modern frontend frameworks, Vue CLI 3 sets a new standard in frontend JavaScript frameworks, and comes with a graphical user interface (GUI). This interface makes it a breeze to set up, extend, run, and serve a Vue project.

When you pair this addition of a GUI with the successful attempt to ease the pain of toolchain fatigue by offering a really well thought-out setup process, you get a really powerful combination, and happy developers as a result.