2017-04-23 98 views
1

我試圖在同一臺服務器上使用angular2應用程序託管我的快遞服務。 閱讀相關變化後,我發現變化後的​​解決方案都解決本地服務器http://localhost:3000上,但我託管在Heroku上的應用程序時,我嘗試訪問我的快遞路線與/ API啓動/ ... ...所有運作良好。但無法訪問它開始在頁面上顯示Not Found消息的angular2 UI頁面。如何使angular2路由與express路由器一起工作?

app.all('*', (req, res) => { 
    console.log(`[TRACE] Server 404 request: ${req.originalUrl}`); 
    res.sendFile(path.join(__dirname, 'dist/index.html')); 
}); 

app.use(function(req, res, next) { 
    res.sendFile(path.join(__dirname, 'dist/index.html')); 
}); 

app.get('/*', function (req, res) { 
    res.sendFile(path.join(__dirname, 'dist/index.html')); 
}); 

app.get(/^\/([^a]|a[^p]|ap[^i]|api[^/]).*$/,(req,res) => { 
    res.sendFile(path.join(__dirname, 'dist/index.html')); 
}); 
+0

什麼是「我想訪問我的快遞路線與/ API開始部署/ ...一切運作良好,但無法訪問angular2 UI它開始在頁面上顯示Not Found消息。「意思?什麼不起作用? – echonax

+0

它沒有顯示我的angular2應用程序登錄頁面。 –

+0

這幾乎是不可能猜測錯誤是基於你給出的信息。請分享你的文件夾結構,你的路由細節,也許你的Heroku的網址,如果它不是私人 – echonax

回答

1

當我部署我的應用程序的託管服務器,我發現dist目錄中沒有得到部署在服務器包含Angular應用程序構建,獲取cr跑完ng build - 產品

首先,我手動將其上傳到託管服務器,我的應用程序開始正常工作。然後在我看來,每次都是手動任務,所以我找到了解決這個問題的兩個解決方案。

  1. 首先,從.gitignore文件中刪除/ dist項,這意味着當我將應用程序推送到任何託管服務器時,它不會忽略dist目錄。
  2. 其次,我從這個鏈接https://docs.npmjs.com/misc/scripts閱讀的package.json文件,瞭解有關安裝前和安裝後腳本,並更新了我的package.json文件有以下腳本。

    "scripts": { 
        "ng": "ng", 
        "start": "node index.js", 
        "build": "ng build", 
        "test": "ng test", 
        "lint": "ng lint", 
        "e2e": "ng e2e", 
        "postinstall": "ng build --prod" 
    }, 
    

閱讀這篇文章在Heroku https://paucls.wordpress.com/2016/11/25/deploy-angular-2-cli-app-to-heroku/