? ? ? ? 今天弄了下前后端分離，由于學的不多，對于webpack不是太懂，于是按著自己的理解來搭了下環(huán)境。
? ? ?前端使用的框架是Angular5，后端使用的是express。IDEA一個是webstorm，因為其對Angular支持很好，所以用于編寫Angular。另一個是vscode，用于編寫express。
? ? ? ? 主要步驟
? ? ? ? 1、搭建Angular工程
ng new front-end
? ? ? ? 2、搭建express工程
express back-end
? ? ? ? 3、然后是關鍵的一步，它可以快速地將前端的頁面部署到后端里。
? ? ? ? ? ? ? ?在angular的工程文件夾里找到.angular-cli.json文件，修改它的outDir，如下圖
????????????（我這里是把它的生成的文件放在了后端的public文件夾下）
? ? 4、如果使用的是Webstorm，可以點擊Edit Configurations來快速配置
????????選擇添加-npm
????????按照下圖配置，這就相當于模擬了npm run build指令
????????（如果沒有用webstorm也可以直接在終端里面輸入ng build構建）
? ? 5、等待結束后，打開后端工程，就會發(fā)現(xiàn)public里已經(jīng)有一些文件了，這些就是angular構建的文件了。然后就該配置后端了。
? ? ? ? 由于express默認的模板引擎是jade（個人覺得不好用，還是html大法好），也因為Angular默認生成的是html頁面，那么我們就將express的模板引擎改成html的吧！
? ? ? ? 打開express工程文件夾，安裝ejs模塊
npm install ejs
? ? ? ? 然后打開app.js
? ? ? ? 把原來的
app.set('view engine','jade');
????????替換為
app.engine('html',require('ejs').__express)
app.set('view engine','html');
? ? ? ? 這時候就可以直接渲染html了！
? ? ? ? 路由這些設置為index.html就可以使用angular了
? ? 6、最后在express工程下，終端里輸入npm start就可以啟動express服務器了
http://localhost:3000/
? ? ? ? 7、最后的最后就是全后端通吃的學習開始了。
