@kr_ilya

Как разрабатывать vue.js + node.js на локалке?

Во vue и node новичок!
Как совместить Node.js и vue.js, чтобы они работали как обычный сайт? Сейчас отдельно запускаю через консоль vue
E:\project> npm run dev
В итоге на сайт можно попасть по адресу localhost:8080
В этом же проекте лежит файл server.js, для запуска которого я добавил start в package.json
"scripts": {
    "serve": "vue-cli-service serve",
    "dev": "npm run serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint",
    "start": "node server/server.js"
  }

Содержание файла такое:
const express = require('express');
const app = express();
const path = require('path');
var http = require('http').Server(app);
var io = require('socket.io')(http);
// var ip = require('ip');
// var i = ip.address() // my ip address


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

io.on('connection', function(socket){
  console.log('an user connected');
});

http.listen(3000, function(){
  console.log('listening on *:3000');
});

После его запуска, он выводит запись в консоль и ставится доступен сервер по адресу localhost:3000
Как совместить node и vue?
Как в таком случае они будут работать на сервере?
Как осуществить работу socket.io?

Может есть готовые примеры?
В гугле ничего понятного не нашел, может просто искал плохо.
  • Вопрос задан
  • 2612 просмотров
Решения вопроса 1
На production они уже будут работать на одном порту.

На локалке в дев работают в браузере с приложением, которое поднято vue (webpack dev server, в вашем случае на 8080).

Чтобы запросы с приложения шли на сервер на nodejs достаточно добавить прокси в вебпак.
Во vue.conf.js (или как там конфиг называется) добавить в конфиг вебпака:
devServer: {
    proxy: {
      '/api': 'http://localhost:3000'
    }
}


Ссылка на доку по прокси в вебпаке

Ссылка на доку по конфигурированию вебпака во vue cli

Это всё, если у вас SPA.
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

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

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