vue-cli3.0安裝與配置

zilu 發布于2019-08-23 16:17 / 1080人閱讀

摘要：安裝與配置最近公司要開新項目，用配置，讓我搞一搞，做個記錄。最好自己去官網過一遍的文檔安裝完成后檢測一下是否安裝成功，如下圖展示。顯示以上就安裝成功。第一個默認配置只會安裝和，其它的需要自己配置，不建議選，這里我們選擇第二個手動配置。

vue-cli3.0安裝與配置

最近公司要開新項目，用vue-cli3.0配置，讓我搞一搞，做個記錄。

安裝

首先你要升級到cli3.0，命令如下。(最好自己去官網過一遍cli3.0的文檔)

npm install -g @vue/cli-service-global

安裝完成后檢測一下是否安裝成功，如下圖展示。

顯示3.0以上就安裝成功。

創建一個項目

vue create hello-world

創建過程中，會讓你選一系列的配置，鍵盤上下鍵可以切換，空格鍵可以選取，回車鍵確認。下面我一一細說。

第一個默認配置只會安裝babel和eslint，其它的需要自己配置，不建議選，這里我們選擇第二個手動配置。按回車（鍵盤上下鍵可以上下切換選擇）

從上往下分別為（注：空格鍵可以選定）

babel：用來將es6的代碼編譯為es5
typescript：javascript的一個超集，我這里沒選
Progressive Web App (PWA) Support： pwa技術
Router：路由
Vuex：全局狀態管理
CSS Pre-processors： css預處理
Linter / Formatter： 風格檢查器
Unit Testing：單元測試
E2E Testing：e2e測試

這里選擇可以根據個人需求來進行選擇

下一步，選擇eslint的風格，這里不多啰嗦，直接選擇第三個standard（應為前幾個我也不了解-_-）

這里是問你，要在保存時設置lint還是在提交是設置lint，我這里設置保存時lint（第一個）

這里是問你將babel，eslint，postcss這些配置放在那里

In dedicated config files：放在相應的文件中
In package.json：放在package.json中

這里是問你是否保存預設，當你選擇是的時候，下次你在執行vue create xxx的時候，會默認選擇這些設置，建議選否

走到這一步就配置完成，等待安裝完成。

GPU云服務器云服務器安裝與配置安裝與配置詳解 laravel安裝與配置 hadoop安裝與配置

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

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

（小白篇）vue-cli3.0創建項目+引入element-ui

摘要：在年月份發布了版本，經過重構之后，可以說是一個船心版本在項目都落地之后，就想升級一下版本，嘗一嘗帶來的舒適，也是為后面項目的開展做一個準備。選了之后會詢問是否開啟模式，以及選擇預處理器，這里根據個人情況選用。 vue-cli在2018年8月份發布了3.0版本，經過重構之后，可以說是一個船心版本！在項目都落地之后，就想升級一下cli版本，嘗一嘗3.0帶來的舒適，也是為后面項目的開展做一個...

avwu 2019-08-23 16:43 評論0 收藏0
vue-cli 3.0

摘要：配置環境變量參考打包后項目的啟動發生了變化，之前可以直接打開，現在需要參數的意思是將其架設在模式下這個模式會處理即將提到的路由問題 (第一章)學習vue-cli 3.0腳手架構建vue項目 vue學習鞏固及遇到的問題首先這次使用的vue腳手架為vue-cli 3.0，它跟之前的腳手架改變了很多，這里我也沒去細細的研究，也只懂得了最基本的用法，參考: vue-cli 3 地址：http...

April 2019-08-23 11:36 評論0 收藏0
vue-cli 3.0

摘要：配置環境變量參考打包后項目的啟動發生了變化，之前可以直接打開，現在需要參數的意思是將其架設在模式下這個模式會處理即將提到的路由問題 (第一章)學習vue-cli 3.0腳手架構建vue項目 vue學習鞏固及遇到的問題首先這次使用的vue腳手架為vue-cli 3.0，它跟之前的腳手架改變了很多，這里我也沒去細細的研究，也只懂得了最基本的用法，參考: vue-cli 3 地址：http...

mengera88 2019-06-26 17:48 評論0 收藏0
vue-cli 3.0 源碼分析

摘要：寫在前面其實最開始不是特意來研究的源碼，只是想了解下的命令，如果想要了解命令的話，那么繞不開寫的。通過分析發現與相比，變化太大了，通過引入插件系統，可以讓開發者利用其暴露的對項目進行擴展。 showImg(https://segmentfault.com/img/bVboijb?w=1600&h=1094); 寫在前面其實最開始不是特意來研究 vue-cli 的源碼，只是想了解下 n...

yiliang 2019-08-23 15:11 評論0 收藏0
vue-cli 3.0 使用

摘要：安裝如果想要使用首先需要全局安裝，前提要求版本必須是及以上默認會覆蓋，如果想要在使用版本的時候同時使用版本，那么執行以下命令該命令是安裝一個橋接工具，版本的命令依然會被保留創建也可以通過命令打開一個圖形化界面進行配置配置在版本中會安裝如果想要使用vue cli 3.0 首先需要全局安裝，前提要求Node.js版本必須是8.0及以上 npm install -g @vue/cli v...

PumpkinDylan 2019-08-23 15:14 評論0 收藏0