vue/cli和vue版本對應(yīng)及安裝方式
Vue Cli
Vue CLI = Vue + 一堆的js插件
1、cli 全稱就是Command-Line Interface,翻譯為命令行界面,俗稱 腳手架
2、Vue Cli 就是一個官網(wǎng)發(fā)布的vue.js項(xiàng)目的腳手架
3、使用vue-cli 可以幫我們快速的搭建Vue開發(fā)環(huán)境以及對應(yīng)的webpack配置
使用方式
Vue CLI是一個腳手架,通俗點(diǎn)說就是代碼生成器,可以快速生成一套基于Vue完整的前端框架,單獨(dú)編譯,單獨(dú)部署??梢栽偌筛鞣N第三方插件,擴(kuò)展出更多的功能。
Vue是漸近式框架,你可以用它一個功能,也可以用全家桶。比如你可以在老的jsp或thymeleaf項(xiàng)目里,引入vue.js,只用它核心的數(shù)據(jù)綁定功能。
如果項(xiàng)目過于簡單,就是一些基本的數(shù)據(jù)渲染,不必要使用Vue Cli腳手架。當(dāng)開發(fā)大型項(xiàng)目的時候,需要考慮代碼目錄結(jié)構(gòu),項(xiàng)目結(jié)構(gòu),部署以及熱更新等瑣碎的事情,可以將這些事情交給腳手架去配置。
關(guān)于Vue Cli版本介紹
舊版本名稱為 vue-cli,新版本是 @vue/cli。
如果已經(jīng)全局安裝了舊版本的vue-cli(1.x或2.x),你需要先通過 npm uninstall vue-cli -g 或 yarn global remove vue-cli 卸載它。
npm uninstall vue-cli -g 或 yarn global remove vue-cli
@vue/cli 安裝
注意:Vue Cli 需要Node.js 8.9或更高版本(推薦8.11.0+)。
你可以使用nvm或nvm-windows在同一臺電腦中管理多個Node版本。
- npm install -g @vue/cli (安裝的是最新版)
- npm install vue-cli@2.9.6 (指定版本安裝【指定版本為3.0以下版本】,其中2.9.6為版本號)
- npm install -g @vue/cli@3.11.0(指定版本安裝【指定版本為3.0以上版本】,其中3.11.0為版本號)
通過命令行查詢可用的包的版本號:
npm view vue-cli versions --json (3.0以下版本) npm view @vue/cli versions --json (3.0以上版本)
Vue/cli版本查看:
vue -V
版本號對應(yīng)
- Vue CLI 4.5以下,對應(yīng)的是Vue2
- Vue CLI 4.5及以上,對應(yīng)的是Vue3
- 但是使用vue init 創(chuàng)建項(xiàng)目的時候會有機(jī)會選擇,可以選擇Vue2
查看vue和@vue/cli版本
vue -V 和 vue --version 是查看 vue-cli(腳手架)的版本的.
C:\Users\Mavis>vue -V @vue/cli 5.0.8
查看vue版本使用如下命令:
npm list vue || npm list vue -g
注意:
Vue Cli3.X和4.X的腳手架的模板和Vue Cli2.X完全不同。
總結(jié)
以上為個人經(jīng)驗(yàn),希望能給大家一個參考,也希望大家多多支持腳本之家。
相關(guān)文章
vue基于v-charts封裝雙向條形圖的實(shí)現(xiàn)代碼
這篇文章主要介紹了vue基于v-charts封裝雙向條形圖的實(shí)現(xiàn)代碼,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-12-12
uniapp模仿微信實(shí)現(xiàn)聊天界面的示例代碼
這篇文章主要介紹了如何利用uniapp模仿微信,實(shí)現(xiàn)一個聊天界面。文中的示例代碼講解詳細(xì),對我們學(xué)習(xí)Vue有一定的幫助,感興趣的可以了解一下2022-01-01
ElementUI?復(fù)雜頂部和左側(cè)導(dǎo)航欄實(shí)現(xiàn)示例
本文主要介紹了ElementUI?復(fù)雜頂部和左側(cè)導(dǎo)航欄實(shí)現(xiàn)示例,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2022-04-04
基于前端VUE+ElementUI實(shí)現(xiàn)table行上移或下移功能(支持跨頁移動)
有時候需要前端實(shí)現(xiàn)上移和下移功能,下面這篇文章主要給大家介紹了關(guān)于如何基于前端VUE+ElementUI實(shí)現(xiàn)table行上移或下移(支持跨頁移動)的相關(guān)資料,文中通過代碼介紹的非常詳細(xì),需要的朋友可以參考下2024-07-07
Vue3中無法為el-tree-select設(shè)置反選問題解析
這篇文章主要介紹了Vue3中無法為el-tree-select設(shè)置反選問題分析,本文給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下2023-04-04
Vue前端左側(cè)菜單右側(cè)內(nèi)容的網(wǎng)站界面制作過程
這篇文章主要介紹了使用Vue和ElementUI制作一個帶有左側(cè)菜單和右側(cè)內(nèi)容區(qū)的網(wǎng)站頁面的過程,文中通過CSS樣式和深度作用符,實(shí)現(xiàn)了頁面的美化和功能的完善,需要的朋友可以參考下2025-02-02
vue mintui-Loadmore結(jié)合實(shí)現(xiàn)下拉刷新和上拉加載示例
本篇文章主要介紹了vue mintui-Loadmore結(jié)合實(shí)現(xiàn)下拉刷新和上拉加載示例,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-10-10

