All Projects → KuangPF → Vue Cli Analysis

KuangPF / Vue Cli Analysis

Licence: mit
vue-cli 源码分析 (vue-cli3)

Programming Languages

javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to Vue Cli Analysis

Vue Cli Plugin Electron Builder
Easily Build Your Vue.js App For Desktop With Electron
Stars: ✭ 3,549 (+1037.5%)
Mutual labels:  cli, vue-cli
Iview Cli
Create an iView project in visual way
Stars: ✭ 729 (+133.65%)
Mutual labels:  cli, vue-cli
Bullet
🚅 Interactive prompts made simple. Build a prompt like stacking blocks.
Stars: ✭ 3,257 (+943.91%)
Mutual labels:  cli
Has
✅ checks presence of various command line tools and their versions on the path
Stars: ✭ 309 (-0.96%)
Mutual labels:  cli
Nb
CLI and local web plain text note‑taking, bookmarking, and archiving with linking, tagging, filtering, search, Git versioning & syncing, Pandoc conversion, + more, in a single portable script.
Stars: ✭ 3,846 (+1132.69%)
Mutual labels:  cli
Ludusavi
Backup tool for PC game saves
Stars: ✭ 301 (-3.53%)
Mutual labels:  cli
G
Simple go version manager, gluten-free
Stars: ✭ 307 (-1.6%)
Mutual labels:  cli
Create Node Cli
📟 CLI to create new Node.js CLI applications in minutes not hours.
Stars: ✭ 304 (-2.56%)
Mutual labels:  cli
Laravel Packer
Awesome Command Line Tool for speeding up your package creation.
Stars: ✭ 313 (+0.32%)
Mutual labels:  cli
Wob
A lightweight overlay volume/backlight/progress/anything bar for Wayland.
Stars: ✭ 306 (-1.92%)
Mutual labels:  cli
Php Console
🖥 PHP CLI application library, provide console argument parse, console controller/command run, color style, user interactive, format information show and more. 功能全面的PHP命令行应用库。提供控制台参数解析, 命令运行,颜色风格输出, 用户信息交互, 特殊格式信息显示
Stars: ✭ 310 (-0.64%)
Mutual labels:  cli
Svelvet
🧵 An experimental svelte compiler & watcher that works with snowpack
Stars: ✭ 310 (-0.64%)
Mutual labels:  cli
Php Watcher
Monitor for any changes in your php application and automatically restart it (suitable for async apps).
Stars: ✭ 303 (-2.88%)
Mutual labels:  cli
Whatspup
🔳 WhatsApp chat from commandline/console/cli using GoogleChrome puppeteer
Stars: ✭ 310 (-0.64%)
Mutual labels:  cli
Singlefile
Web Extension for Firefox/Chrome/MS Edge and CLI tool to save a faithful copy of an entire web page in a single HTML file
Stars: ✭ 4,417 (+1315.71%)
Mutual labels:  cli
Nuxt Material Admin
Vue-CLI Boilerplate based on Nuxt and vue-material-admin template.
Stars: ✭ 310 (-0.64%)
Mutual labels:  vue-cli
Frankenstein
Correct README Redirects
Stars: ✭ 305 (-2.24%)
Mutual labels:  cli
Getopt Php
A PHP library for command-line argument processing
Stars: ✭ 305 (-2.24%)
Mutual labels:  cli
Pastel
A command-line tool to generate, analyze, convert and manipulate colors
Stars: ✭ 3,742 (+1099.36%)
Mutual labels:  cli
Ghost Cli
CLI Tool for installing & updating Ghost
Stars: ✭ 313 (+0.32%)
Mutual labels:  cli

vue-cli 源码分析

@vue/cli @vue/cli-service node-version platform Github action License

写在前面

其实最开始不是特意来研究 vue-cli 的源码,只是想了解下 node 的命令,如果想要了解 node 命令的话,那么绕不开 tj 写的 commander.js。在学习 commander.js 过程中发现 vue-cli 的交互方式挺炫酷的,然后就去看了下源码,所以就有了这个仓库。

慎重提醒:我对 vue-cli 的源码以及其中的一些知识点并不熟悉,如果我对其中的知识点非常了解的话我就不会来分析了,分析源码只是想更加了解 vue-cli 整个工具的实现过程以及 vue-cli3 的一些新特性。如果文中有描述有误,还请各位大大 issues or PR

相关说明

vue-cli 仓库 dev 分支下面 package 目录包含了 clicli-serviceCLI 插件UI 插件cli 工具函数代码等等。本项目中的 package 文件夹里面对其中的代码有一定的注释,主要集中在 clicli-service 上,有兴趣的同学可以 fork 后查看。

目录

@vue/cli

@vue/cli-service

请作者喝杯咖啡☕️

如果觉得文章对你有所帮助,不如请作者喝杯咖啡 ☕️

总结

vue-cli-analysis 整个项目可大致分为两个部分,一部分是 vue 命令分析,包含 create,add,invoke, ui 等等,另一部分就是 vue-cli-service 的分析。通过分析发现与 2.X 相比,3.0 变化太大了,通过引入插件系统,可以让开发者利用其暴露的 API 对项目进行扩展。在分析之前对插件机制不是很了解,不知道如何实现的,分析之后逐渐了解了其实现机制,而且对于 vue 项目的配置也更加熟悉了。除此之外,在分析过程过程中还了解了很多有意思的 npm 包,比如 execa, debug, lowdb,lodash,inquirer 等等,最后,如果你想学习 node 命令或者想写一些比较有意思的命令行工具的话,阅读 vue-cli 源码是一个不错的选择。

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].