vue cli使用總結

2021-07-30 02:45:19 字數 965 閱讀 3840

在開發較大專案時,為方便多人共同開發,我們需要考慮**目錄結構、語法規範、專案構建和部署、熱載入、**單元測試等事情。而腳手架即是為我們自動完成這些基本工作的構建工具,在 vue.js 生態中我們可以使用 vue-cli 腳手架工具來快速構建專案。

手腳架的搭建可查閱:鏈結

browserify – 擁有高階功能的 browserify + vueify 用於 正式開發

browserify-****** – 擁有基礎功能的 browserify + vueify 用於 快速開發

****** – 單個 html,用於開發最簡單的 vue.js 應用

webpack – 擁有高階功能的 webpack + vue-loader 用於正式開發

webpack-****** – 擁有基礎功能的 webpack + vue-loader 用於快速開發

1.安裝node ^6

2.全域性安裝vue-cli

npm stall vue-cli

-g

vue init >

>

//以webpack為例

vue init webpack projectname

4.互動選項

以webpack構建為例, 有:

eslint: 檢查語法規範

karma + mocha: 單元測試

//-y 跳過互動

vue init >

>

-y

5.進入目錄安裝依賴

cd projectname

npm install

6.執行開發模式

// 具體修改package.json配置

npm run dev

vue cli專案使用scss

介紹乙個vue專案給大家學習,閱讀別人的專案可以快速提高自己哦,移動端vue完整專案 安裝node sass sass loader style loader,進入webpack.base.config.js配置scss。所以增加如下 當然,如果需要在vue檔案style標籤使用scss的話,需要宣...

使用vue cli構建專案。

所以操作皆在命令列下完成 npm install golbal vue clivue init webpack workname workname為專案名 tables areproject name 專案名 不可大寫 project description 專案描述 author 作者vue bu...

使用nodeJs安裝Vue cli

安裝完成node,node有自帶的npm,可以直接在cmd中,找到nodejs安裝的路徑下,進行命令列全域性安裝vue cli。npm install global vue cli 想安裝速度快點,可以使用 映象如下 命令提示符執行 npm install cnpm g registry 注意 安裝...