egg.js 與 vue 結(jié)合 ， 使用腳手架 easywebpack-cli。

1. 了解egg目錄結(jié)構(gòu)（koa）

2. 全局安裝easywebpack-cli npm install easywebpack-cli -g
   npm 安裝過程中反復(fù)報(bào)錯(cuò)，最后用了cnpm，雖然安裝成功，但不知道后面會(huì)不會(huì)出現(xiàn)其他報(bào)錯(cuò)

3. 項(xiàng)目初始化 easy init
   選擇項(xiàng)目配置：
   配置1：此處選擇的是第四個(gè): create server side render project boiloerplate for Egg + Vue... 提示上給的是 Use arrow keys, 我試了一下沒用，直接輸入4，然后按enter。
   配置2：create ... egg + vue single page ... 輸入 1，然后按 enter
   另外幾個(gè)中還有一個(gè)是multie page
   配置3：projectname / project description / ...
   

   選擇配置

4. 執(zhí)行完第三步，根據(jù)官網(wǎng)提示，進(jìn)入項(xiàng)目文件夾后直接執(zhí)行 easy start 或者 node index.js會(huì)報(bào)錯(cuò)。

錯(cuò)誤1

錯(cuò)誤1 解決辦法：

//  ${app_root}/config/config.local.js 補(bǔ)充添加如下代碼：
const EasyWebpack = require('easywebpack-vue');

module.exports = app => {
...
//  本地開發(fā)時(shí)，讀取 Webpack 配置
  exports.webpack = {
    webpackConfigList: EasyWebpack.getWebpackConfig()
  };
...
return exports;
}

5. 運(yùn)行項(xiàng)目 node index.js
   
   http://127.0.0.1:7001

常見錯(cuò)誤：

錯(cuò)誤2

以上是使用easywebpack-cli進(jìn)行快速搭建，或者直接clone egg-vue-webpack-boilerplate GitHub egg-vue-webpack-boilerplate
也可以通過egg-init 手動(dòng)搭建
參考資源：Egg + Vue 服務(wù)端渲染工程化實(shí)現(xiàn)