vue-cli 3.0 源碼分析

yiliang 發布于2019-08-23 15:11 / 2806人閱讀

摘要：寫在前面其實最開始不是特意來研究的源碼，只是想了解下的命令，如果想要了解命令的話，那么繞不開寫的。通過分析發現與相比，變化太大了，通過引入插件系統，可以讓開發者利用其暴露的對項目進行擴展。

寫在前面

其實最開始不是特意來研究 vue-cli 的源碼，只是想了解下 node 的命令，如果想要了解 node 命令的話，那么繞不開 tj 寫的 commander.js。在學習 commander.js 過程中發現 vue-cli 的交互方式挺炫酷的，然后就去看了下源碼，所以就有了這篇文章。

鏈接

vue-cli 3.0 源碼分析

目錄 @vue/cli

前言

介紹

開始

環境介紹

常見 npm 包

vue create

create 入口

整體分析

基礎驗證

獲取預設選項（preset）

依賴安裝（installDeps）

Generator

結尾分析

總結

vue add

add 入口

安裝插件

調用插件

總結

vue invoke

invoke 命令

vue inspect

inspect 命令

vue serve

serve 命令

vue build

build 命令

vue ui

ui 入口

整體分析

server 端

client 端

總結

vue init

init 入口

@vue/cli-init 分析

vue-cli 2.x init 分析

generate 函數分析

總結

vue config

config 命令

vue upgrade

upgrade 命令

vue info

info 命令

@vue/cli-service

整體介紹

入口

new Service()

service.run()

內置插件

serve

build

inspect

help

總結

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 源碼是一個不錯的選擇。

云服務器 GPU云服務器 vue-cli vue-cli3 gradle-3.0 jsf 3.0

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/101652.html

vue-cli3.0源碼分析@vue/cli-----add和invoke

上一篇已經講了create命令；那么這一篇我們來看一下add和invoke這個命令。之所以放一起講，是因為當add執行的時候，也會去執行invoke add vue add vue-cli-plugin-xxx 或 vue add @vue/xxx 通過這種形式就是vue-cli3.0內部能識別的插件了首先來看一下入口 program .command(add [pluginOptions]...

sorra 2019-08-23 16:54 評論0 收藏0
vue-cli3.0源碼分析@vue/cli-----create

摘要：本文主要學習的源碼的記錄。這里有一個的示例的數據會被插件生成器用來生成相應的項目文件。另一個遠程版本另外而是通過包獲取的版本。本文主要學習vue-cli3.0的源碼的記錄。源碼地址: https://github.com/vuejs/vue-cli 主要對packages里面的@vue進行學習。如下圖 showImg(https://segmentfault.com/img/...

JasonZhang 2019-08-23 16:51 評論0 收藏0
關于Vue2一些值得推薦的文章 -- 五、六月份

摘要：五六月份推薦集合查看最新的請點擊集前端最近很火的框架資源定時更新，歡迎一下。蘇幕遮燎沈香宋周邦彥燎沈香，消溽暑。鳥雀呼晴，侵曉窺檐語。葉上初陽乾宿雨，水面清圓，一一風荷舉。家住吳門，久作長安旅。五月漁郎相憶否。小楫輕舟，夢入芙蓉浦。五、六月份推薦集合查看github最新的Vue weekly；請::點擊::集web前端最近很火的vue2框架資源；定時更新，歡迎 Star 一下。蘇...

sutaking 2019-08-02 15:17 評論0 收藏0
關于Vue2一些值得推薦的文章 -- 五、六月份

摘要：五六月份推薦集合查看最新的請點擊集前端最近很火的框架資源定時更新，歡迎一下。蘇幕遮燎沈香宋周邦彥燎沈香，消溽暑。鳥雀呼晴，侵曉窺檐語。葉上初陽乾宿雨，水面清圓，一一風荷舉。家住吳門，久作長安旅。五月漁郎相憶否。小楫輕舟，夢入芙蓉浦。五、六月份推薦集合查看github最新的Vue weekly；請::點擊::集web前端最近很火的vue2框架資源；定時更新，歡迎 Star 一下。蘇...

khs1994 2019-08-23 18:08 評論0 收藏0