部署完成但Herokuapp网站上没有任何内容; React Webpack应用程序

时间:2018-03-10 09:15:18

标签: node.js reactjs webpack webpack-dev-server node-modules

我正在尝试在Heroku上部署我的React Webpack应用程序,并且正在执行一些基本步骤,例如在package.json上编辑我的脚本。

我添加了“postinstall”和“start”脚本,创建了一个server.js文件。

这是我的package.json(我已经完成了sudo NPM安装-g webpack,以及npm install,它让我的$ webpack -p运行)。

我可以运行$ node server.js在localhost:8080中启动我的项目。我从终端的server.js文件中获取“Server started”,项目确实在我的本地主机上呈现。

然后,我做了:

$git add.
$git commit -am "deploy commit"
$git push heroku master

我收到一条消息“构建成功!”但是当我打开应用程序时,该网站显示没有任何呈现。

我做错了什么?

以下是我最近运行的$ heroku日志。

 2018-03-10T16:10:03.000000+00:00 app[api]: Build started by user redactedname@gmail.com
2018-03-10T16:10:46.421847+00:00 app[api]: Release v8 created by user redactedname@gmail.com
2018-03-10T16:10:46.771508+00:00 heroku[web.1]: Restarting
2018-03-10T16:10:46.773432+00:00 heroku[web.1]: State changed from up to starting
2018-03-10T16:10:46.421847+00:00 app[api]: Deploy 564e8921 by user redactedname@gmail.com
2018-03-10T16:10:03.000000+00:00 app[api]: Build succeeded
2018-03-10T16:10:47.709064+00:00 heroku[web.1]: Stopping all processes with SIGTERM
2018-03-10T16:10:47.791386+00:00 heroku[web.1]: Process exited with status 143
2018-03-10T16:10:53.037456+00:00 heroku[web.1]: Starting process with command `npm start`
2018-03-10T16:10:54.902517+00:00 app[web.1]: 
2018-03-10T16:10:54.902538+00:00 app[web.1]: > redux-simple-starter@1.0.0 start /app
2018-03-10T16:10:54.902540+00:00 app[web.1]: > node server.js
2018-03-10T16:10:54.902542+00:00 app[web.1]: 
2018-03-10T16:10:55.116187+00:00 app[web.1]: Server started
2018-03-10T16:10:55.335272+00:00 heroku[web.1]: State changed from starting to up
2018-03-10T16:10:58.234416+00:00 heroku[router]: at=info method=GET path="/" host=weatherapp101.herokuapp.com request_id=e985ba8d-1e9e-4e9b-829c-1593329b1c65 fwd="123.198.0.36" dyno=web.1 connect=1ms service=19ms status=200 bytes=762 protocol=https
2018-03-10T16:10:58.412820+00:00 heroku[router]: at=info method=GET path="/style/style.css" host=weatherapp101.herokuapp.com request_id=1cbe3df1-d253-459e-b092-4a0e376cb7dc fwd="123.198.0.36" dyno=web.1 connect=1ms service=3ms status=200 bytes=510 protocol=https
2018-03-10T16:10:58.587208+00:00 heroku[router]: at=info method=GET path="/bundle.js" host=weatherapp101.herokuapp.com request_id=e6bf0498-e486-4535-b321-b1a395abe467 fwd="123.198.0.36" dyno=web.1 connect=1ms service=15ms status=200 bytes=315609 protocol=https
2018-03-10T16:11:18.173974+00:00 heroku[router]: at=info method=GET path="/favicon.ico" host=weatherapp101.herokuapp.com request_id=9dd508ad-04eb-4dc7-9ad1-00fd5e67c074 fwd="123.198.0.36" dyno=web.1 connect=1ms service=4ms status=200 bytes=762 protocol=https

这是heroku构建日志:

-----> Node.js app detected
-----> Creating runtime environment

       NPM_CONFIG_LOGLEVEL=error
       NODE_VERBOSE=false
       NODE_ENV=production
       NODE_MODULES_CACHE=true
-----> Installing binaries
       engines.node (package.json):  unspecified
       engines.npm (package.json):   unspecified (use default)

       Resolving node version 8.x...
       Downloading and installing node 8.10.0...
       Using default npm version: 5.6.0
-----> Restoring cache
       Loading 2 from cacheDirectories (default):
       - node_modules
       - bower_components (not cached - skipping)
-----> Building dependencies
       Installing node modules (package.json)

       > redux-simple-starter@1.0.0 postinstall /tmp/build_aa21f1c37823732c65451d55f7047e90
       > webpack -p

       Hash: 0846607ee102f618af36
       Version: webpack 1.15.0
       Time: 8198ms
       Asset    Size  Chunks             Chunk Names
       bundle.js  315 kB       0  [emitted]  main
       [0] multi main 28 bytes {0} [built]
       + 240 hidden modules

       WARNING in bundle.js from UglifyJs
       Condition always true [./~/react/lib/ReactMount.js:764,0]
       Condition always true [./~/react/lib/findDOMNode.js:46,0]
       Condition always true [./~/react/lib/instantiateReactComponent.js:80,0]
       Dropping unreachable code [./~/react/lib/shouldUpdateReactComponent.js:40,0]
       Condition always true [./~/react/lib/traverseAllChildren.js:158,0]
       Side effects in initialization of unused variable support [./~/lodash/index.js:932,0]
       Condition always true [./~/lodash/index.js:12323,0]
       Dropping unreachable code [./~/lodash/index.js:12337,0]
       Side effects in initialization of unused variable moduleExports [./~/lodash/index.js:266,0]
       Condition always true [./~/react-sparklines/build/index.js:2,0]
       Dropping unreachable code [./~/react-sparklines/build/index.js:4,0]
       Side effects in initialization of unused variable width [./~/react-sparklines/build/index.js:1511,0]
       Side effects in initialization of unused variable width [./~/react-sparklines/build/index.js:1626,0]
       Side effects in initialization of unused variable width [./~/react-sparklines/build/index.js:1843,0]
       Side effects in initialization of unused variable height [./~/react-sparklines/build/index.js:1844,0]
       Condition always true [./~/react/lib/ReactDOMComponent.js:907,0]
       Dropping side-effect-free statement [./~/react/lib/ReactEventListener.js:72,0]
       Dropping unused function handleTopLevelWithPath [./~/react/lib/ReactEventListener.js:98,0]
       Dropping unused variable DOCUMENT_FRAGMENT_NODE_TYPE [./~/react/lib/ReactEventListener.js:26,0]
       Condition always true [./~/symbol-observable/lib/index.js:22,1]
       Dropping unreachable code [./~/symbol-observable/lib/index.js:25,0]
       up to date in 15.615s
-----> Caching build
       Clearing previous node cache
       Saving 2 cacheDirectories (default):
       - node_modules
       - bower_components (nothing to cache)
-----> Pruning devDependencies
       Skipping because npm 5.6.0 sometimes fails when running 'npm prune' due to a known issue
       https://github.com/npm/npm/issues/19356

       You can silence this warning by updating to at least npm 5.7.1 in your package.json
       https://devcenter.heroku.com/articles/nodejs-support#specifying-an-npm-version
-----> Build succeeded!
-----> Discovering process types
       Procfile declares types     -> (none)
       Default types for buildpack -> web
-----> Compressing...
       Done: 31.8M
-----> Launching...
       Released v8
       https://weatherapp101.herokuapp.com/ deployed to Heroku

这是我的package.json:

{
  "name": "redux-simple-starter",
  "version": "1.0.0",
  "description": "Simple starter package for Redux with React and Babel support",
  "main": "index.js",
  "repository": "git@github.com:StephenGrider/ReduxSimpleStarter.git",
  "scripts": {
    "dev": "node ./node_modules/webpack-dev-server/bin/webpack-dev-server.js",
    "postinstall": "webpack -p",
    "start": "node server.js",
    "test": "mocha --compilers js:babel-core/register --require ./test/test_helper.js --recursive ./test",
    "test:watch": "npm run test -- --watch"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "babel-core": "^6.2.1",
    "babel-loader": "^6.2.0",
    "babel-preset-es2015": "^6.1.18",
    "babel-preset-react": "^6.1.18",
    "chai": "^3.5.0",
    "chai-jquery": "^2.0.0",
    "jquery": "^2.2.1",
    "jsdom": "^8.1.0",
    "mocha": "^2.4.5",
    "react-addons-test-utils": "^0.14.7",
    "webpack": "^1.12.9",
    "webpack-dev-server": "^1.14.0"
  },
  "dependencies": {
    "axios": "^0.18.0",
    "babel-preset-stage-1": "^6.1.18",
    "lodash": "^3.10.1",
    "react": "^0.14.3",
    "react-dom": "^0.14.3",
    "react-redux": "4.3.0",
    "react-router": "^2.0.1",
    "react-sparklines": "^1.6.0",
    "redux": "^3.0.4",
    "redux-promise": "^0.5.3"
  }
}

这是webpack.config.js:

module.exports = {
  entry: [
    './src/index.js'
  ],
  output: {
    path: __dirname,
    publicPath: '/',
    filename: 'bundle.js'
  },
  module: {
    loaders: [{
      exclude: /node_modules/,
      loader: 'babel',
      query: {
        presets: ['react', 'es2015', 'stage-1']
      }
    }]
  },
  resolve: {
    extensions: ['', '.js', '.jsx']
  },
  devServer: {
    historyApiFallback: true,
    contentBase: './'
  }
};

0 个答案:

没有答案