今天做了一個部屬的動作XD
簡單說就是使用Angular部屬至 Heroku
第一步:註冊Heroku的帳號，登入後如下
我這命名為 demo-angular-learn
第二步:確認安裝好angular 的 cli
ng new demo-angular
cd demo-angular
ng serve --open
確認可以執行!!!
第三步:
npm install express --save
開始設定 package.json
修改 scripts 中start ，新增 postinstall 標籤
"scripts": {
..........
"start": "node server.js",
"postinstall": "ng build --aot --prod"
...........
},
{
.......
"scripts"....
........
........
"engines": {
"node": "~10.15.3",
"npm": "~6.4.1"
}
}
創建
server.js
輸入(demo-angular 為資料夾的名稱)
//Install express server
const express = require('express');
const path = require('path');
const app = express();
// Serve only the static files form the dist directory
app.use(express.static(__dirname + '/dist/demo-angular'));
app.get('/*', function(req,res) {
res.sendFile(path.join(__dirname+'/dist/demo-angular/index.html'));
});
// Start the app by listening on the default Heroku port
app.listen(process.env.PORT || 8080);
第四步:確認git已安裝
於demo-angular 資料夾下
git init
git add .
git commit -m "init app"
請注意heroku中demo-angular-learn deploy 下
heroku git:clone -a demo-angular-learn
git push heroku master
完成後
請執行heroku open
完成後的網址如下
PS:
本來想要部屬ngx-admin的網站
但是部不上去啊，我想是因為只有支援靜態網頁
所以沒有辦法執行，尚待研究中
0 意見