将我的MERN项目部署到heroku之后,“无法获取/”

时间:2020-10-02 08:06:17

标签: javascript node.js webpack heroku-cli

在本地运行时,该应用程序可以运行..但是当我尝试将其部署到heroku时,我会收到“无法获取/”

我可能无法运行正确的脚本,据我了解,npm启动脚本应该是“ node server.js”,但是其他脚本应该是什么?

package.json

{
  "homepage": "changed",
  "name": "changed",
  "private": true,
  "version": "1.0.0",
  "description": "changed",
  "main": "",
  "engines": {
    "node": "12.x"
  },
  "scripts": {
    "heroku-prebuild": "npm install --dev",
    "build": "webpack --config webpack.prod.js",
    "dev": "webpack-dev-server --config webpack.dev.js --open",
    "start": "node src/server/server.js"
  },

问题可能出在服务器配置上

server.js

const bodyParser = require('body-parser');
const express = require('express');
const mongoose = require('mongoose');
const Country = require('./model/country');
const Restaurant = require('./model/restaurant');


const {resolve} = require('path');
const fs = require('fs');
const path = require('path');
const cookieParser = require('cookie-parser');

const config = {
  mongoURL: process.env.MONGODB_URI || 'mongodb://localhost:27017/reviews',
  port: process.env.PORT || 8000
};

//setup database
mongoose.Promise = global.Promise;
// MongoDB Connection
if (process.env.NODE_ENV !== 'test') {
  mongoose.connect(config.mongoURL, {useNewUrlParser: true}, (error) => {

    if (error) {
      console.error('Please make sure Mongodb is installed and running!');
      throw error;
    } else {
      console.log('connected to database!');
    }
  });
}

const app = express();

//body parser for json. must be done before API routes
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({extended: false})); //handle body requests
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

// Add backend api routes
fs.readdirSync(__dirname + '/api').forEach((file) => {
  require(`./api/${file.substr(0, file.indexOf('.'))}`)(app);
});

app.use(function (err, msg, req, res, next) {
  console.error(err.stack);
  res.status(500).json({error: err});
});

app.listen(config.port,
  () => console.log(`Listening on port ${config.port}!`));

我在freecodecamp youtube视频中看到的Webpack配置

webpack.common.js

const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CleanWebpackPlugin = require('clean-webpack-plugin');

const outputDirectory = 'dist';

module.exports = {
  entry: ['babel-polyfill', './src/client/main.js'],
  module: {
    rules: [{
      test: /\.(js|jsx)$/,
      exclude: /node_modules/,
      use: {
        loader: 'babel-loader'
      }
    },
      {
        test: /\.css$/,
        use: ['style-loader', 'css-loader']
      },
      {
        test: /\.(gif|png|woff|woff2|eot|ttf|svg)$/,
        loader: 'url-loader?limit=100000'
      },
        {
            test: /\.scss$/,
            use: [
                "style-loader", // creates style nodes from JS strings
                "css-loader", // translates CSS into CommonJS
                "sass-loader" // compiles Sass to CSS, using Node Sass by default
            ]
        }
    ]
  },
  resolve: {
    extensions: ['*', '.js', '.jsx']
  },

  plugins: [
    new HtmlWebpackPlugin({
      template: './public/index.html',
      favicon: './public/favicon.ico'
    })
  ]
};

webpack.prod.js

const path = require('path');
const common = require("./webpack.common");
const { merge } = require("webpack-merge");

const outputDirectory = 'dist';

module.exports = merge(common, {
  mode: "production",
  output: {
    path: path.join(__dirname, outputDirectory),
    filename: 'bundle.js',
    publicPath: '/'
  }
});

有人可以向我解释/找到一个来源,该来源解释生产服务器上的客户端会发生什么情况吗?

1 个答案:

答案 0 :(得分:0)

您的代码中的任何地方都没有任何app.get(path)。

您可以在这里https://expressjs.com/en/guide/routing.html

了解更多信息