Сервер Express в nuxt, как настроить?

Всем добрейший вечерочек. Я начал разбираться с nuxt, по видеоурокам, и уперся в одну неприятность, на видеоуроках при установке nuxt у сансея было предложено нужно ли устанавливать express.. и тогда появлялась отдельная папка, в общей структуре - server, внутри которой уже происходила дальнейшая работа. А у меня при установке, такого вопроса не было, соответственно по умолчанию и папки server нет, пожалуйста подскажите мне как можно решить эту проблему. Я уже установил експресс отдельно, но мне не понятно как это все заставить работать? Как и где делать маршруты, модели? У меня есть папка express, в модулях nuxt. содержимое файла index.js в этой папке такое
'use strict';

module.exports = require('./lib/express');


Мне нужно где то прописать настройки mongoose и подключение к mongodb. А как и где , я к сожалению не понимаю.. объясните кто может.. Может у кого то тоже такие сложности были..
  • Вопрос задан
  • 1158 просмотров
Пригласить эксперта
Ответы на вопрос 2
FinGanapre
@FinGanapre
Если вопроса не появилось, возможно вы не выбрали SSR при генерации приложения (mode: 'universal' в nuxt.config.js должно быть)

Примерно так должны выглядеть файлы. В app.js работаем как с обычным express далее, только запуск сервера у нас в index.js, так что в app.js его запускать не нужно, просто экспортируем и импортируем в index.js в котором и запускаем (тут уже всё сделано, просто объяснил)

Структура:
server/index.js
server/app.js

index.js

const consola = require('consola')
const { Nuxt, Builder } = require('nuxt')
const app = require('./app')

// Import and Set Nuxt.js options
const config = require('../nuxt.config.js')
config.dev = process.env.NODE_ENV !== 'production'

async function start () {
  // Init Nuxt.js
  const nuxt = new Nuxt(config)

  const { host, port } = nuxt.options.server

  await nuxt.ready()
  // Build only in dev mode
  if (config.dev) {
    const builder = new Builder(nuxt)
    await builder.build()
  }

  // Give nuxt middleware to express
  app.use(nuxt.render)

  // Listen the server
  app.listen(port, host, () => {
		consola.ready({
			message: `Server listening on http://${host}:${port}`,
			badge: true
		})
	})
}
start()


app.js

const express = require('express')
const app = express()

module.exports = app



Новый способ:
nuxt.config.js

serverMiddleware: {
    '/api': '~/api'
  },



api/index.js

const express = require('express')

// Create express instance
const app = express()

app.get('/', (req, res) => res.status(200).json([{name: "Robert"}, {name: "John"}]))

// Export express app
module.exports = app

// Start standalone server if directly running
if (require.main === module) {
  const port = process.env.PORT || 3001
  app.listen(port, () => {
    console.log(`API server listening on port ${port}`)
  })
}



pages/index.vue

<template lang="pug">
  div
    p(v-for="user in users") {{ user.name }}
</template>
<script>
export default {
  async asyncData({ $axios }) {
    const users = await $axios.$get('/api/')

    return {
      users,
    }
  },
}
</script>

Ответ написан
Если проходите курс, то лучше брать те же версии технологий, что и у автора. Чтоб не ловить подобные ситуации.

Шаблон с express сейчас можно установить так
express будет находиться в папке api
npm install -g @vue/cli
npm install -g @vue/cli-init
vue init nuxt-community/express-template <project-name>

https://github.com/nuxt-community/express-template
Ответ написан
Ваш ответ на вопрос

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

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