vue-cli 介紹與安裝
1、前言
vue-cli
是和vue
進行深度組合的工具,可以快速幫我們創(chuàng)建vue
項目,并且把一些腳手架相關(guān)的代碼給我們創(chuàng)建好。真正使用vue開發(fā)項目,都是用vue-cli
來創(chuàng)建項目的。
2、vue-cli介紹
Vue CLI
是一個基于 Vue.js
進行快速開發(fā)的完整系統(tǒng),提供:
- 通過
@vue/cli
實現(xiàn)的交互式的項目腳手架。 - 通過
@vue/cli + @vue/cli-service-global
實現(xiàn)的零配置原型開發(fā)。
- 一個運行時依賴
(@vue/cli-service),
該依賴:
- (1)可升級;
- (2)基于
webpack
構(gòu)建,并帶有合理的默認配置;9 - (3)可以通過項目內(nèi)的配置文件進行配置;
- (4)可以通過插件進行擴展。
- 一個豐富的官方插件集合,集成了前端生態(tài)中最好的工具。
- 一套完全圖形化的創(chuàng)建和管理
Vue.js
項目的用戶界面。
Vue CLI
致力于將 Vue
生態(tài)中的工具基礎(chǔ)標準化。它確保了各種構(gòu)建工具能夠基于智能的默認配置即可平穩(wěn)銜接,這樣你可以專注在撰寫應(yīng)用上,而不必花好幾天去糾結(jié)配置的問題。與此同時,它也為每個工具提供了調(diào)整配置的靈活性,無需 eject
。
2.1、CLI
CLI (@vue/cli)
是一個全局安裝的 npm
包,提供了終端里的 vue
命令。它可以通過 vue create
快速搭建一個新項目,或者直接通過 vue serve
構(gòu)建新想法的原型。你也可以通過 vue ui
通過一套圖形化界面管理你的所有項目。
2.2、CLI 服務(wù)
CLI
服務(wù) (@vue/cli-service)
是一個開發(fā)環(huán)境依賴。它是一個 npm
包,局部安裝在每個 @vue/cli
創(chuàng)建的項目中。
CLI
服務(wù)是構(gòu)建于 webpack
和 webpack-dev-server
之上的。它包含了:
- 加載其它
CLI
插件的核心服務(wù); - 一個針對絕大部分應(yīng)用優(yōu)化過的內(nèi)部的
webpack
配置; - 項目內(nèi)部的
vue-cli-service
命令,提供serve
、build
和inspect
命令。
2.3、CLI 插件
CLI
插件是向你的 Vue 項目提供可選功能的 npm 包,例如 Babel/TypeScript
轉(zhuǎn)譯、ESLint
集成、單元測試和 end-to-end
測試等。Vue CLI
插件的名字以 @vue/cli-plugin-
(內(nèi)建插件) 或 vue-cli-plugin
- (社區(qū)插件)開頭,非常容易使用。
當(dāng)你在項目內(nèi)部運行 vue-cli-service
命令時,它會自動解析并加載 package.json
中列出的所有 CLI
插件。
插件可以作為項目創(chuàng)建過程的一部分,或在后期加入到項目中。它們也可以被歸成一組可復(fù)用的 preset
。
3、@vue-cli安裝
Vue CLI 4.x
需要 Node.js v8.9
或更高版本 (推薦 v10 以上)。你可以使用 n
,nvm
或 nvm-windows
在同一臺電腦中管理多個 Node 版本。
安裝命令如下:
npm install -g @vue/cli
可以用這個命令來檢查其版本是否正確
vue --version
到此這篇關(guān)于vue-cli 介紹與安裝的文章就介紹到這了,更多相關(guān)vue-cli 介紹與安裝內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
關(guān)于Vue Router的10條高級技巧總結(jié)
這篇文章主要給大家總結(jié)介紹了關(guān)于Vue Router的10條高級技巧,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-05-05uniapp使用v-loading并且不引入element-ui的操作方法
這篇文章主要介紹了uniapp使用v-loading并且不引入element-ui,首先創(chuàng)建loading.js,創(chuàng)建lloading.scss,本文結(jié)合示例代碼給大家介紹的非常詳細,對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下2022-10-10vue之組件內(nèi)監(jiān)控$store中定義變量的變化詳解
今天小編就為大家分享一篇vue之組件內(nèi)監(jiān)控$store中定義變量的變化詳解,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2019-11-11一篇文章教你實現(xiàn)VUE多個DIV,button綁定回車事件
這篇文章主要介紹了VUE多個DIV綁定回車事件,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2021-10-10