Я пытаюсь подать свое приложение реакции от экспресса, почему я получаю 404? - PullRequest
Новая
       16

Я пытаюсь подать свое приложение реакции от экспресса, почему я получаю 404?

0 голосов
/ 20 марта 2019

У меня есть приложение реагирования, которое создается в каталоге / dist моего проекта, я пытаюсь передать пакет и необходимые файлы через мой экспресс-сервер, а также подключиться к mongo и предоставить там API для некоторых данных.

Сейчас я не могу загрузить приложение.Я получаю сообщение об ошибке GET http://localhost:5000/dist/bundle.js net::ERR_ABORTED 404 (Not Found) на локальном хосте: 5000

Ниже приведен файл моего сервера, а остальная часть проекта здесь

server.js: 

require('dotenv').config();
const express = require('express');
const bodyParser = require('body-parser');
const mongoose = require('mongoose');
const routes = require('./routes/api');
const path = require('path');

const app = express();

const port = process.env.PORT || 5000;

//connect to the database
mongoose.connect('mongodb://localhost:27017/test', { useNewUrlParser: true })
  .then(() => console.log(`Database connected successfully`))
  .catch(err => console.log(err));

// overide mongoose promise (depricated) with node's promise
mongoose.Promise = global.Promise;

app.use((req, res, next) => {
  // TODO: should header be set on res or req?
  res.header("Access-Control-Allow-Origin", "*");
  res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
  next();
});

app.use(bodyParser.json());

app.use('/api', routes);

app.use((err, req, res, next) => {
  console.log(err);
  next();
});

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

app.use('/../dist', express.static('dist'));

app.listen(port, () => {
  console.log(`Server running on port ${port}`)
});

1 Ответ

1 голос
/ 20 марта 2019

Получил это на работу. Хотя я бы предложил перейти на мой fullstack-mern-kit , но вам решать.

В любом случае, выполните следующие действия ...

В package.json изменить scripts на: 

  "scripts": {
    "dev": "webpack-dev-server --config ./webpack.config.js --mode development",
    "build": "webpack --mode=production",
    "start": "node ./server.js",
    "test": "echo \"Error: no test specified\" && exit 1"
  },

В вашей папке dist добавьте index.html (вам также необходимо включить <link> в скомпилированную таблицу стилей css): 

<!DOCTYPE html>
<html>
  <head>
    <title>The Minimal React Webpack Babel Setup</title>
  </head>
  <body>
    <div id="app"></div>
    <script src="./bundle.js"></script>
  </body>
</html>

В вашем файле server.js переработайте его так: 

const express = require("express");
const app = express();
const { resolve } = require("path");

app.get("/sampleData", (req, res) => {
  res.send("sample data");
});

app.use(express.static("dist"));

app.get("*", (req, res) => res.sendFile(resolve("dist", "index.html")));

app.listen(8080);

Запустите npm run build, затем npm start, затем перейдите к http://localhost:8080.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...