danielchistyakov
@danielchistyakov
Frontend Developer

Как задеплоить fullstack-приложение на Vercel?

Здравствуйте, для обхода CORS пришлось внедрить Express для совершения запросов из под бэкенда. При деплое приложения на Vercel выскакивает ошибка в логах:
The project was built assuming it is hosted at /.
17:40:54.491  	You can control this with the homepage field in your package.json.
17:40:54.491  	The build folder is ready to be deployed.
17:40:54.491  	You may serve it with a static server:
17:40:54.491  	  npm install -g serve
17:40:54.491  	  serve -s build


Build command, которую я прописал:
NPM_CONFIG_PRODUCTION=false npm install --prefix client && npm run build --prefix client


Структура проекта (упростил для наглядности):
/client
    /public
    /src
    /package.json
/routes
package.json
server.js


Package.json для бэкенда:
{
    "name": "backend",
    "version": "1.0.0",
    "description": "",
    "main": "server.js",
    "type": "module",
    "scripts": {
        "client": "npm start --prefix client",
        "client-install": "npm install --prefix client",
        "start": "node server.js",
        "server": "nodemon server.js",
        "dev": "concurrently \"npm run server\" \"npm run client\""
    },
    "author": "",
    "license": "ISC",
    "dependencies": {
        "axios": "^0.21.1",
        "cheerio": "^1.0.0-rc.10",
        "express": "^4.17.1",
        "path": "^0.12.7",
        "querystring": "^0.2.1"
    }
}


Package.json для фронтенда:
{
    "name": "kino",
    "version": "0.1.0",
    "private": true,
    "proxy": "http://localhost:5000",
    "dependencies": {
        "@material-ui/core": "^4.11.3",
        "@material-ui/icons": "^4.11.2",
        "@material-ui/utils": "^4.11.2",
        "@testing-library/jest-dom": "^5.12.0",
        "@testing-library/react": "^11.1.0",
        "@testing-library/user-event": "^12.1.10",
        "idb-keyval": "^5.0.5",
        "mobx": "^6.3.0",
        "mobx-react-lite": "^3.2.0",
        "react": "^17.0.2",
        "react-copy-to-clipboard": "^5.0.3",
        "react-dom": "^17.0.2",
        "react-full-screen": "^1.0.2",
        "react-helmet-async": "^1.0.9",
        "react-image": "^4.0.3",
        "react-indiana-drag-scroll": "^2.0.1",
        "react-lazy-load-image-component": "^1.5.1",
        "react-lazyload": "^3.2.0",
        "react-loading-skeleton": "^2.2.0",
        "react-player": "^2.9.0",
        "react-router-dom": "^5.2.0",
        "react-scripts": "4.0.3",
        "react-youtube": "^7.13.1",
        "sass": "^1.32.11",
        "sass-loader": "^11.0.1",
        "screenfull": "^5.1.0",
        "swiper": "^6.7.0",
        "web-vitals": "^1.0.1"
    },
    "scripts": {
        "start": "react-scripts start",
        "build": "react-scripts build",
        "test": "react-scripts test",
        "eject": "react-scripts eject"
    },
    "eslintConfig": {
        "extends": [
            "react-app",
            "react-app/jest"
        ]
    },
    "browserslist": {
        "production": [
            ">0.2%",
            "not dead",
            "not op_mini all"
        ],
        "development": [
            "last 1 chrome version",
            "last 1 firefox version",
            "last 1 safari version"
        ]
    }
}


Мой server.js:
import express from 'express';
import path from 'path';
import film from './routes/film.js';
import search from './routes/search.js';
import related from './routes/related.js';
import details from './routes/details.js';
const app = express();
const port = 5000;

app.get('/', (req, res) => {
    res.send('Отказано в доступе')
})

app.use('/film', film);
app.use('/search', search);
app.use('/related', related);
app.use('/details', details);

if (process.env.NODE_ENV === 'production') {
    app.use(express.static('client/build'));

    app.get('*', (req, res) => {
        res.sendFile(path.resolve(__dirname, 'client', 'build', 'index.html'));
    })
}

app.listen(port, () => console.log(`App is listening on port ${port}!`))

export default app;


Все инструкции, которые мне удавалось найти были для Heroku, а для Vercel ничего не видел. Буду благодарен за помощь.
  • Вопрос задан
  • 47 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы