簡介
使用Heroku的免費(fèi)云服務(wù)來部署Express服務(wù)器披摄，數(shù)據(jù)庫使用的是MongoDB云數(shù)據(jù)庫。由于國內(nèi)訪問這兩個(gè)網(wǎng)站的速度可能較慢勇凭，所以最好備有梯子疚膊。
一、前后端結(jié)合
1虾标、Vue項(xiàng)目打包
使用npm run build來打包我們已經(jīng)寫好的Vue項(xiàng)目寓盗。將打包完成后的dist文件夾復(fù)制到Express項(xiàng)目中。
注意:由于后端的端口會發(fā)生改變璧函，所以api地址也會發(fā)生改變傀蚌。所以前端的api請求地址也要做出相應(yīng)的修改，不然部署后將無法請求到數(shù)據(jù)蘸吓。
由于不知道端口將會變成多少善炫，我的方法是將api地址的前段設(shè)置為部署后的網(wǎng)址，即https://yourHerokuAppName.herokuapp.com/api
2库继、Express后端設(shè)置
(1)設(shè)置服務(wù)器端口號
由于Heroku的端口號是自行配置的箩艺，所以我們要將服務(wù)器端口號設(shè)置為窜醉；
const port = process.env.PORT || 3000;
app.listen(port, () => {
console.log(`http://localhost:${port}`);
});
(2)設(shè)置靜態(tài)文件路徑
var fs = require('fs');
var path = require('path');
app.use(express.static(path.resolve(__dirname, './dist')));
(3)將路由指向index.html
app.get('*', function(req, res) {
res.sendFile(path.resolve(__dirname, './dist/index.html'));
});
(4)創(chuàng)建Procfile文件
在項(xiàng)目的根目錄中新建名為Procfile的文件，并寫入
web: node index.js
Procfile 文件用來聲明應(yīng)用如何在服務(wù)器中運(yùn)行艺谆，這里通過 node index.js 執(zhí)行 Node 腳本榨惰。其中，index.js為服務(wù)器的起始文件静汤。
3琅催、文件上傳Github
將前后端結(jié)合好后的文件上傳到github倉庫中。
二撒妈、部署到Heroku
首先注冊一個(gè)Heroku賬號(163,yeah,qq郵箱被禁用)恢暖；注冊完成后登錄Heroku并創(chuàng)建一個(gè)app；由于連接Heroku的網(wǎng)速較慢狰右，所以使用Github的部署方式，在Github授權(quán)之后舆床，選擇要部署的文件倉庫及分支棋蚌；最后點(diǎn)擊部署按鈕，等待部署完成后就可以查看網(wǎng)站了挨队。
部署參考文章：三步將Node應(yīng)用部署到Heroku上
