2017-05-08 53 views
0

我正在尝试将我的React js应用程序(使用react-router v4和webpack)部署到heroku。404未找到| NGINX - 尝试将客户端React代码部署到Heroku和Webpack

不幸的是,当实际访问页面时,根据heroku的部署脚本(参见下文),没有发现任何错误页面。

最初Heroku给出了构建错误,但我能够消除构建错误,现在它已成功构建,我不知道接下来要排除故障。

我整个项目代码: https://github.com/aronlmin/react_doesnt_work/blob/master/webpack.config.js

aronlilland:backbone_cac_client (master)$ git push heroku master 
Counting objects: 3, done. 
Delta compression using up to 8 threads. 
Compressing objects: 100% (3/3), done. 
Writing objects: 100% (3/3), 315 bytes | 0 bytes/s, done. 
Total 3 (delta 2), reused 0 (delta 0) 
remote: Compressing source files... done. 
remote: Building source: 
remote: 
remote: -----> React.js (create-react-app) multi app detected 
remote: =====> Downloading Buildpack: 
https://github.com/heroku/heroku-buildpack-multi.git 
remote: =====> Detected Framework: Multipack 
remote: =====> Downloading Buildpack: https://github.com/heroku/heroku-buildpack-nodejs.git 
remote: =====> Detected Framework: Node.js 
remote: 
remote: -----> Creating runtime environment 
remote:   
remote:  NPM_CONFIG_LOGLEVEL=error 
remote:  NPM_CONFIG_PRODUCTION=false 
remote:  NODE_VERBOSE=false 
remote:  NODE_ENV=development 
remote:  NODE_MODULES_CACHE=true 
remote: 
remote: -----> Installing binaries 
remote:  engines.node (package.json): unspecified 
remote:  engines.npm (package.json): unspecified (use default) 
remote:   
remote:  Resolving node version 6.x via semver.io... 
remote:  Downloading and installing node 6.10.3... 
remote:  Using default npm version: 3.10.10 
remote:  Resolving yarn version (latest) via semver.io... 
remote:  Downloading and installing yarn (0.23.4)... 
remote:  Installed yarn 0.23.4 
remote: 
remote: -----> Restoring cache 
remote:  !  node_modules checked into source control 
remote:  https://blog.heroku.com/node-habits-2016#9-only-git-the-important-bits 
remote:   
remote:  Loading 2 from cacheDirectories (default): 
remote:  - node_modules 
remote:  - bower_components (not cached - skipping) 
remote: 
remote: -----> Building dependencies 
remote:  Installing node modules (yarn.lock) 
remote:  yarn install v0.23.4 
remote:  [1/4] Resolving packages... 
remote:  [2/4] Fetching packages... 
remote:  warning [email protected]: The platform "linux" is incompatible with this module. 
remote:  info "[email protected]" is an optional dependency and failed compatibility check. Excluding it from installation. 
remote:  [3/4] Linking dependencies... 
remote:  [4/4] Building fresh packages... 
remote:  $ npm run build 
remote:   
remote:  > [email protected] build /tmp/build_c94a0cec125e5c3a562ef7e154841a47 
remote:  > webpack -p 
remote:   
remote:  Hash: d28b920eb76ccc581c9a 
remote:  Version: webpack 2.5.0 
remote:  Time: 13581ms 
remote:  Asset  Size Chunks     Chunk Names 
remote:  bundle.js  386 kB  0 [emitted] [big] main 
remote:  index.html 383 bytes   [emitted] 
remote:  [0] ./~/react/react.js 56 bytes {0} [built] 
remote:  [1] ./~/fbjs/lib/invariant.js 1.63 kB {0} [built] 
remote:  [26] ./~/react-dom/index.js 59 bytes {0} [built] 
remote:  [35] ./~/react/lib/React.js 3.32 kB {0} [built] 
remote:  [43] ./~/react-dom/lib/EventPluginHub.js 9.11 kB {0} [built] 
remote:  [67] ./~/react-grid-system/build/index.js 1.32 kB {0} [built] 
remote:  [182] ./src/app/App.jsx 4.01 kB {0} [built] 
remote:  [183] ./~/react-tap-event-plugin/src/injectTapEventPlugin.js 1.04 kB {0} [built] 
remote:  [185] ./src/app/Router.jsx 3.75 kB {0} [built] 
remote:  [191] ./src/index.js 723 bytes {0} [built] 
remote:  [310] ./~/material-ui/styles/MuiThemeProvider.js 2.15 kB {0} [built] 
remote:  [342] ./~/react-dom/lib/ReactDOM.js 5.14 kB {0} [built] 
remote:  [405] ./~/react-router-dom/BrowserRouter.js 2.57 kB {0} [built] 
remote:  [428] ./~/react-tap-event-plugin/src/defaultClickRejectionStrategy.js 151 bytes {0} [built] 
remote:  [446] ./src/app/App.css 1 kB {0} [built] 
remote:  + 437 hidden modules 
remote:  Child html-webpack-plugin for "index.html": 
remote:  [0] ./~/lodash/lodash.js 540 kB {0} [built] 
remote:  [1] ./~/html-webpack-plugin/lib/loader.js!./src/index.html 694 bytes {0} [built] 
remote:  [2] (webpack)/buildin/global.js 509 bytes {0} [built] 
remote:  [3] (webpack)/buildin/module.js 517 bytes {0} [built] 
remote:  Done in 43.06s. 
remote: 
remote: -----> Caching build 
remote:  Clearing previous node cache 
remote:  Saving 2 cacheDirectories (default): 
remote:  - node_modules 
remote:  - bower_components (nothing to cache) 
remote: 
remote: -----> Build succeeded! 
remote: =====> Downloading Buildpack: https://github.com/mars/create-react-app-inner-buildpack.git 
remote: =====> Detected Framework: React.js (create-react-app) 
remote:  Using existing `static.json` 
remote:  Enabling runtime environment variables 
remote: 
remote: > [email protected] build /tmp/build_c94a0cec125e5c3a562ef7e154841a47 
remote: > webpack -p 
remote: 
remote: Hash: d28b920eb76ccc581c9a 
remote: Version: webpack 2.5.0 
remote: Time: 13451ms 
remote:  Asset  Size Chunks     Chunk Names 
remote: bundle.js  386 kB  0 [emitted] [big] main 
remote: index.html 383 bytes   [emitted]   
remote: [0] ./~/react/react.js 56 bytes {0} [built] 
remote: [1] ./~/fbjs/lib/invariant.js 1.63 kB {0} [built] 
remote: [26] ./~/react-dom/index.js 59 bytes {0} [built] 
remote: [35] ./~/react/lib/React.js 3.32 kB {0} [built] 
remote: [43] ./~/react-dom/lib/EventPluginHub.js 9.11 kB {0} [built] 
remote: [67] ./~/react-grid-system/build/index.js 1.32 kB {0} [built] 
remote: [182] ./src/app/App.jsx 4.01 kB {0} [built] 
remote: [183] ./~/react-tap-event-plugin/src/injectTapEventPlugin.js 1.04 kB {0} [built] 
remote: [185] ./src/app/Router.jsx 3.75 kB {0} [built] 
remote: [191] ./src/index.js 723 bytes {0} [built] 
remote: [310] ./~/material-ui/styles/MuiThemeProvider.js 2.15 kB {0} [built] 
remote: [342] ./~/react-dom/lib/ReactDOM.js 5.14 kB {0} [built] 
remote: [405] ./~/react-router-dom/BrowserRouter.js 2.57 kB {0} [built] 
remote: [428] ./~/react-tap-event-plugin/src/defaultClickRejectionStrategy.js 151 bytes {0} [built] 
remote: [446] ./src/app/App.css 1 kB {0} [built] 
remote:  + 437 hidden modules 
remote: Child html-webpack-plugin for "index.html": 
remote:  [0] ./~/lodash/lodash.js 540 kB {0} [built] 
remote:  [1] ./~/html-webpack-plugin/lib/loader.js!./src/index.html 694 bytes {0} [built] 
remote:  [2] (webpack)/buildin/global.js 509 bytes {0} [built] 
remote:  [3] (webpack)/buildin/module.js 517 bytes {0} [built] 
remote: =====> Downloading Buildpack: https://github.com/heroku/heroku-buildpack-static.git 
remote: =====> Detected Framework: Static HTML 
remote: % Total % Received % Xferd Average Speed Time Time  Time Current 
remote:         Dload Upload Total Spent Left Speed 
remote: 100 838k 100 838k 0  0 17.5M  0 --:--:-- --:--:-- --:--:-- 17.8M 
remote: -----> Installed directory to /app/bin 
remote: Using release configuration from last framework (Static HTML). 
remote: -----> Discovering process types 
remote:  Procfile declares types  -> (none) 
remote:  Default types for buildpack -> web 
remote: 
remote: -----> Compressing... 
remote:  Done: 31.7M 
remote: -----> Launching... 
remote:  Released v5 
remote:  https://cacbackboneclient.herokuapp.com/ deployed to Heroku 
remote: 
remote: Verifying deploy... done. 
To https://git.heroku.com/cacbackboneclient.git 
    9c5b5c6..d6cd99c master -> master 
+0

是否的WebPack产生有效文件当你在本地运行它?你的网站在本地工作吗? – speckledcarp

+0

是的,在本地工作就好 - 但是我不知道如何测试npm运行版本,开发版本正常工作 – aronlmin

+0

Webpack通常使用不同的版本配置作为本地版本和发布版本。 'npm run build'应该将所有内容发送到一个文件夹。该文件夹应该有一个index.html文件。只需在浏览器中打开它即可。如果一切Webpacked正确,网站应该运行为dev设备的版本(虽然没有任何热重载功能)。我不确定这是否是问题,但需要检查。 – speckledcarp

回答

3

错误是一个buildpack问题,我使用(由第三方服务推荐特定的第三方buildpack部署默认裸露的骨头反应应用的buildpack )

我的应用程序无法定位,因为在buildpack wasnt指向服务器我创造dist文件夹在我的index.html文件,它一直在寻找一个不同的文件夹完全

请留意

,如果您有任何网页应用程序的部署问题,请使用以下buildpack并确保您指定的捆绑式应用程序的根文件夹

https://github.com/heroku/heroku-buildpack-static

相关问题