2017-02-19 45 views
1

之前,我能解決我的webpack問題,這要歸功於。但是,當我嘗試部署我的反應應用程序時,我沒有收到任何錯誤,但在瀏覽到我已部署的鏈接時遇到了「無法獲取/」。我嘗試更改script,甚至將我的整個項目移動到public文件夾。沒有什麼似乎爲我工作。我在這個過程中缺少什麼步驟?部署到heroku時獲取「無法GET /」,但沒有錯誤消息?

這裏是我的項目的目錄如下所示:

|-node_modules 
|-public 
    |-app 
    |-src 
    |-webpack.config.js 
|-package.json 
|-Procfile 
|-server.js 

app文件夾中包含我的HTML,CSS和main.js文件。 src文件夾包含我的組件。這是我當前的package.json文件:

{ 
    "name": "", 
    "version": "1.0.0", 
    "description": "", 
    "main": "index.js", 
    "scripts": { 
    "serve": "webpack-dev-server" 
    }, 
    "author": "", 
    "license": "ISC", 
    "dependencies": { 
    "babel-core": "5.8.*", 
    "babel-loader": "5.3.*", 
    "express": "^4.14.1", 
    "react": "^15.4.2", 
    "react-dom": "^15.4.2", 
    "webpack": "^1.14.0", 
    "webpack-dev-server": "^2.3.0" 
    } 
} 

這是我的server.js:

var express = require('express'); 
var app = express(); 

app.use(express.static(__dirname + '/public')); 

app.listen(process.env.PORT || 8080); 

我欣賞的幫助。謝謝。

回答

0
  • 類型heroku logs,這樣你可以看到錯誤有點緊密

  • 確保您Procfile看起來是這樣的:web: webpack-dev-server

  • 你有一個路由文件夾中。如果沒有,請執行以下操作:創建一個路由文件夾,添加一個名爲index.js的文件。在該文件中,添加:

    var express = require('express');
    var router = express.Router();

    router.get( '/',函數(REQ,水庫,下一個){
    res.status(200)。發送( 「嗨,它的工作原理!」)
    });

  • 在你server.js文件中添加
    var videos = require('./routes/index');
    app.use('/vids', videos);

  • 測試它在本地,如果發展順利的話,重新部署它的Heroku。

+0

我試過了你的建議,我覺得我正在接近。首先,在**腳本**中,我必須這樣做:**「scripts」:{「scripts」:{「start」:「node ./bin/wwwr"}}**。如果我執行**「腳本」,我會得到一個錯誤:{「start」:「node ./bin/www」} **,我不確定這是爲什麼。當我運行'npm start'並瀏覽到** localhost:8080/app **時,我看到了我的項目標題,但其餘的內容不在那裏。我總是運行'webpack-dev-server'並轉到瀏覽器,內容就在那裏。我如何在啓動時加入'webpack-dev-server'? – emvo

+0

我看到你正在使用webpack-dev-serve。所以,把你的package.json放在「腳本」中:{「serve」:「webpack-dev-server」},這很好。並像平常一樣開始你的項目。 (webpack-dev-serve) 在你的Procfile中添加:web:webpack-dev-server。看起來這是你的缺失。然後再部署 –

+0

我調整了我的Procfile和package.json文件,當我試圖部署它時,當我瀏覽部署的鏈接時,出現**應用程序錯誤**。我看着日誌,並得到**找不到模塊'webpack/bin/config-yargs'**。所以,我試圖更新我的webpack到'webpack「:」2.2.0-rc.3'來查看它是否是版本問題。之後,根據日誌,「應用程序錯誤」是由「入口點大小禁止推薦的限制(250kB)」錯誤消息引起的。有什麼我可以嘗試在這一點上? – emvo