使用vue cli構建乙個vue應用

2022-07-16 06:45:11 字數 1010 閱讀 5017

第一步:安裝vue-cli

在命令列視窗中輸入如下命令,回車

npm install -g vue-cli

安裝完成之後:使用vue -v(大寫的v)檢測是否安裝成功,如下圖出現版本號,則說明安裝成功.

可以通過只輸入vue命令來檢視可選的命令及引數

第二步:用vue-cli來構建專案

執行如下命令,並選擇部分設定,即可生成乙個新的專案.

此時,可以看到資料夾下生成了乙個專案:

第三步:執行如下命令:(進入專案,並執行專案)

cd project1     //

進入專案

npm run dev //

執行專案

這裡報錯了:

解決辦法是:清楚之前裝的包,重新裝包

npm clean cache -f  //

清理快取

npm install

//重新安裝依賴

安裝完:

再次執行:

npm run dev
執行成功:

開啟 http://localhost:8080,見到如下截圖,則建立vue專案成功

end!

使用vue cli搭建乙個vue專案

npm i vue vue cli g2.開始搭建,並使用webpack進行管理vue init webpack projectname 開始搭建 在搭建的過程中,它會詢問以下問題 project name projectname 專案名是否為projectnam project descripti...

vue全家桶(一) 使用 vue cli 構建專案

一.安裝node.js 二.安裝vue cli 全域性安裝 vue cli npm install g vue cli最新的 vue 專案模板中,都帶有 webpack 外掛程式,所以這裡可以不安裝 webpack。然後再命令列工具中使用 vue v 注意 v 大寫 檢視是否安裝成功。三.用 vue...

快速構建乙個vue專案

首先介紹一下命令列構建乙個vue專案步驟 2 命令列介面輸入 cnpm install vue cli g,全域性安裝vue.cli腳手架,輸入vue list 出現如下資訊即可。3 選擇乙個目錄建立專案資料夾,cd命令到該資料夾,輸入命令 vue init webpack 專案名稱 根據提示填寫對...