OK, so I have installed webpack over npm. Additional I need some additional code in the vue.config.js, correct? Now my vue.config.js is:
const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
transpileDependencies: true,
configureWebpack: {
devServer: {
proxy: {
'/api': {
target: 'http://localhost:3080',
},},},},})
And edit the Endpoint to ...app.post("/api/signup",async (req,res)=>{... but its not work.
I get this error: Proxy error: Could not proxy request /api/signup from localhost:8080 to http://localhost:3080 (ECONNREFUSED).
vue.js - How to route Vue Server to Node.js Backend - Stack Overflow
Vue with own backend code on server (Node.js+Vue.js)
How to link Vue frontend to Nodejs backend
vue.js - How can you connect vue with node.js? - Stack Overflow
Well if you need to run both on the same port you could first build your app so that you receive a dist directory or whatever your output directory is named and set up an express server that serves that app and otherwise handles your api requests
const express = require("express");
const path = __dirname + '/app/views/';
const app = express();
app.use(express.static(path));
app.get('/', function (req,res) {
res.sendFile(path + "index.html");
});
app.get('/api', function (req,res) {
// your api handler
}
app.listen(8080)
Assuming that node and the 'app' will always run on the same server you can just use a template library like ejs.
You would then just bundle the app and api together, assuming that the front-end is tied to the backend, realistically you would not even need to hit the API as you could just return the records as part of the view, however if dynamic elements are needed you could still hit the API.
Now, with that said, if the API is something used by many applications then it would probably make sense to build that out as its own microservice, running on its own server and your frontend would be on its own. This way you have separation of concerns with the API and Vue app.