vue-cli5搭建vue項(xiàng)目的實(shí)現(xiàn)步驟
vue-cli 的最新版本是5.0.4
首先需要全局安裝 vue-cli
yarn global add @vue/cli
已經(jīng)安裝的可以升級(jí)到最新版
yarn global upgrade --latest @vue/cli
然后開(kāi)始使用 vue-cli 5 搭建項(xiàng)目 ‘hello-world’
vue create hello-wold
會(huì)出現(xiàn)下面的配置項(xiàng)：
1. 選擇自動(dòng)配置還是手工配置
選擇手工配置
2. 選擇插件
選擇babel，typscript，路由，css預(yù)編譯，代碼格式化
3. 選擇vue 版本
選擇 vue3
4. 選擇是否使用 class-style component
class-style componnet 是 vue 推出的支持 typescript 的裝飾器，選擇使用
5. 選擇是否使用 babel 為編譯后的 typescript 代碼注入 polyfills
先不用管作用是什么，一定要選擇Y
6. 選擇是否使用 history 風(fēng)格的路由
選擇使用
7. 選擇 css 預(yù)編譯
選擇使用 less
8. 選擇語(yǔ)法檢測(cè)和代碼格式化插件
選擇 ESlint + Prettier，這個(gè)是比較常用另外兩個(gè)是 ESLint+愛(ài)彼迎格式化 以及 ESLint+通用格式化第一個(gè)選項(xiàng)是只使用 ESLint 語(yǔ)法檢測(cè)
9. 選擇語(yǔ)法和格式檢測(cè)的時(shí)間
選擇在保存的時(shí)候就進(jìn)行檢測(cè)
10. 選擇各插件配置的保存方式
選擇將各個(gè)配置單獨(dú)為文件
11. 是否將這個(gè)配置保存下來(lái)
選擇不需要
到這里全部的配置完成
然后就會(huì)執(zhí)行依賴(lài)的下載，最后完成的頁(yè)面如下：
這樣就生成了一個(gè) hello-world 的文件夾，進(jìn)入這個(gè)文件夾，命令行執(zhí)行 yarn serve,
這樣，vue-cli 5 就搭建項(xiàng)目完成，和 vue-cli 4 的相差不大。
到此這篇關(guān)于vue-cli5搭建vue項(xiàng)目的實(shí)現(xiàn)步驟的文章就介紹到這了,更多相關(guān)vue-cli5搭建vue項(xiàng)目?jī)?nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
關(guān)于頁(yè)面刷新vuex數(shù)據(jù)消失問(wèn)題解決方案
本篇文章主要介紹了關(guān)于頁(yè)面刷新vuex數(shù)據(jù)消失問(wèn)題解決方案 ，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-07-07
這篇文章主要介紹了vue中的el-tooltip提示黑框遮擋問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-06-06
完美解決iview 的select下拉框選項(xiàng)錯(cuò)位的問(wèn)題
下面小編就為大家分享一篇完美解決iview 的select下拉框選項(xiàng)錯(cuò)位的問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-03-03
elementUI動(dòng)態(tài)嵌套el-form表單校驗(yàn)舉例詳解
最近工作遇到個(gè)需求,表單可以進(jìn)行增加刪除操作,需要進(jìn)行表單校驗(yàn),這篇文章主要給大家介紹了關(guān)于elementUI動(dòng)態(tài)嵌套el-form表單校驗(yàn)的相關(guān)資料,文中通過(guò)圖文介紹的非常詳細(xì),需要的朋友可以參考下2023-06-06
Vue+Openlayers自定義軌跡動(dòng)畫(huà)
這篇文章主要為大家詳細(xì)介紹了Vue+Openlayers自定義軌跡動(dòng)畫(huà)，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2020-09-09
解決nuxt 自定義全局方法,全局屬性,全局變量的問(wèn)題
這篇文章主要介紹了解決nuxt 自定義全局方法,全局屬性,全局變量的問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2020-11-11
Vue?Steam同款登錄驗(yàn)證數(shù)字輸入框功能
這篇文章主要介紹了Vue?Steam同款登錄驗(yàn)證數(shù)字輸入框功能,本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友參考下吧2024-03-03
vue實(shí)現(xiàn)簡(jiǎn)單表格組件實(shí)例詳解
vue的核心思想就是組件，什么是組件呢？按照我的理解組件就是裝配頁(yè)面的零件，vue三大核心組件 路由 狀態(tài)管理，路由控制頁(yè)面的渲染，頁(yè)面由組件組成，數(shù)據(jù)有vuex進(jìn)行管理和改變。下面我會(huì)以一個(gè)簡(jiǎn)單的案例來(lái)說(shuō)2017-04-04
vue3?TS?vite?element?ali-oss使用教程示例
這篇文章主要為大家介紹了vue3?TS?vite?element?ali-oss使用教程示例,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-07-07
Vuepress 搭建帶評(píng)論功能的靜態(tài)博客的實(shí)現(xiàn)
這篇文章主要介紹了Vuepress 搭建帶評(píng)論功能的靜態(tài)博客的實(shí)現(xiàn)，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-02-02