其實把vue腳手架（vue-cli）從單頁改為多頁，在網上有很多的教程。（大佬請路過）我就做個記錄，以免以後會用到，如果能幫到其他人的更好。不廢話了，進入正題。
node安裝好了之後就可搭建vue-cli了，在安裝之前先檢查node版本，最好是最新的版本，不然用老版本的話會出現一些意想不到的驚喜。可以 node -v 命令檢查node版本。一切工作準備好了後就可以安裝了。
安裝vue-cli就說到這了。vue-cli本身是個單頁應用，但是根據我們專案的需求，需要把改成多頁應用。方法如下：
在修改之前要把我們的目錄要調整一下。最要修改的地方還是在src目錄下。
修改前：
修改後：
就是在src目錄再新建乙個pages的資料夾，用於存放我們的頁面。每個頁面中包含 *.html、*.js、*.vue。三個檔案，如上圖。
主要需要修改的檔案是build目錄下的utils.js、webpack.base.conf.js、webpack.dev.conf.js、webpack.prod.conf.js這四個js檔案。
utils.js 在檔案的後面新增這個**：
// glob是webpack安裝時依賴的乙個第三方模組，還模組允許你使用 *等符號, 例如lib/*.js就是獲取lib資料夾下的所有js字尾名的檔案
var glob = require('glob')
// 頁面模板
var htmlwebpackplugin = require('html-webpack-plugin')
// 取得相應的頁面路徑，因為之前的配置，所以是src資料夾下的pages資料夾
var page_path = path.resolve(__dirname, '../src/pages')
// 用於做相應的merge處理
var merge = require('webpack-merge')
//多入口配置
// 通過glob模組讀取pages資料夾下的所有對應資料夾下的js字尾檔案，如果該檔案存在
// 那麼就作為入口處理
exports.entries = function()
entryfiles.foreach((filepath) => )
return map
}//多頁面輸出配置
// 與上面的多頁面入口配置相同，讀取pages資料夾下的對應的html字尾檔案，然後放入陣列中
exports.htmlplugin = function()
if (process.env.node_env === 'production') ,
chunkssortmode: 'dependency'})}
arr.push(new htmlwebpackplugin(conf))
})return arr
}例如：
webpack.base.conf.js。找到
entry: ,
這段**片段，注釋或者刪除呼叫。替換為
entry:utils.entries() 就完了。
webpack.dev.conf.js。
找到 new htmlwebpackplugin 這個位置 然後裡面的**注釋掉。並在new copywedpackpluin 這個位置下方 新增一段**。.concat(utils.htmlplugin());
例如：
webpack.prod.conf.js
找到new htmlwebpackplugin 這個位置將裡面的**注釋掉。然後在
new copywebpackplugin，新增
.concat(utils.htmlplugin())該**片段。
如圖：
然後需要修改的檔案就都改完了。
這樣改了之後就可以。最後測試的時候 也是可以執行了。排版 很醜，將就將就吧。就這樣吧
vue cli安裝方法
別名 腳手架 版本cli2 cli3 包管理工具優先順序 yarn cnpm npm npm安裝的東西可以被cnpm和yarn的安裝覆蓋 npm install vue cli g cli3的版本 npm install vue cli g cli2的版本 yarn 安裝 yarn add vue ...
vue cli 單檔案元件 工具安裝
在很多 vue 專案中，我們使用 vue.component 來定義全域性元件，緊接著用 new vue 在每個頁面內指定乙個容器元素。這種方式在很多中小規模的專案中運作的很好，在這些專案裡 js 只被用來加強特定的檢視。但當在更複雜的專案中，或者你的前端完全由js驅動的時候，下面這些缺點將變得非常...
vue cli安裝和使用
主要記錄安裝vue cli制定版本和使用，注意vue cli4建立專案命令和專案結構的改變 檢查當前專案的vue cli版本 vue v解除安裝當前版本 npm uninstall vue cli g安裝最新版本 npm install g vue cli安裝指定版本 npm install g v...