I'm over a month into development of a MEVN app with MySQL. I'm using a framework called MEVN-CLI but that shouldn't really matter.
I keep having to change my server port ever few days whenever I get this error:
[nodemon] 2.0.3
[nodemon] to restart at any time, enter `rs`
[nodemon] watching path(s): *.*
[nodemon] watching extensions: js,html,css,json,md
[nodemon] starting `node run server.js --port 9000/api --open`
events.js:288
throw er; // Unhandled 'error' event
^
Error: listen EADDRINUSE: address already in use :::3000
at Server.setupListenHandle [as _listen2] (net.js:1309:16)
at listenInCluster (net.js:1357:12)
at Server.listen (net.js:1445:7)
at Function.listen (C:\Dev\Projects\node-mysql\server\node_modules\express\lib\application.js:618:24)
at Object.<anonymous> (C:\Dev\Projects\node-mysql\server\server.js:258:5)
at Module._compile (internal/modules/cjs/loader.js:1158:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1178:10)
at Module.load (internal/modules/cjs/loader.js:1002:32)
at Function.Module._load (internal/modules/cjs/loader.js:901:14)
at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:74:12)
Emitted 'error' event on Server instance at:
at emitErrorNT (net.js:1336:8)
at processTicksAndRejections (internal/process/task_queues.js:84:21) {
code: 'EADDRINUSE',
errno: 'EADDRINUSE',
syscall: 'listen',
address: '::',
port: 3000
}
I change between 9000, 3000, 3002, 8000, etc. I want to keep it on a single port but this keeps happening and I can't find what's causing it.
I have a client and a server, they communicate with Axios, my Server communicates with a MySQL server I host elsewhere but I also think this is irrelevant but I figure it can't hurt to share that.
Here is my server:
const port = process.env.PORT || 4000;
const env = require("./env.json");
const express = require("express");
const mysql = require("mysql");
const path = require("path");
const bodyParser = require("body-parser");
const favicon = require("serve-favicon");
const app = express();
const cors = require("cors");
const {
testColumns,
showUsers,
searchResultColumns,
showAccountColumns
} = require("./mysql/columns");
app.use(bodyParser.json());
app.use(favicon(path.join(__dirname, "public", "favicon.ico")));
app.use(cors());
//* Build MySQL Connection
const db = mysql.createConnection({
host: env.server,
user: env.user,
password: env.pass,
database: env.schema
});
//* Connect to Database
db.connect((err) => {
if (err) {
console.log("Error Connecting:", err);
}
console.log("MySQL Connected...");
});
app.get(`/api/v1/:query/:x`, (req, res) => {
[Business Logic - Works fine]
if (err) {
// If error
console.log(err);
}
// If no results
else if (results == 0) {
res.send(`No Results\n ${results} \n - ${err}`);
return;
}
// If successful
res.send(results);
});
});
app.get(`/api/v1/:query/`, (req, res) => {
[Business Logic - Works fine]
if (err) {
// If error
console.log(err);
}
// If no results
else if (results == 0) {
res.send(`No Results\n ${results} \n - ${err}`);
return;
}
// If successful
res.send(results);
});
});
//* Root Handler
app.get("/", (req, res) =>
res.sendFile(path.join(__dirname + "/public/index.html"))
);
//? Error Handler
app.get("/404", (req, res) =>
res.sendFile(path.join(__dirname + "/public/404.html"))
);
//! Error Handler
app.get("/sample", (req, res) =>
res.sendFile(path.join(__dirname + "/public/sample.html"))
);
//? Listen for server port
app.listen(port, () => {
console.log(`Sample Dev Server at:${port}`);
});
I deleted some stuff that's not really relevant because it was hundreds of similar lines, I haven't abstracted my routing away yet.
This is my router:
import Vue from "vue";
import Router from "vue-router";
import Home from "./views/Home.vue";
import NotFound from "./views/NotFound.vue";
Vue.use(Router);
export default new Router({
mode: "history",
base: process.env.BASE_URL,
routes: [
{
path: "/",
name: "Home",
component: Home
},
{
path: "/NotFound",
name: NotFound,
component: () => import("./views/NotFound.vue")
},
{
path: "/search",
component: searchPage,
children: [
{ path: "/search/byName", component: searchByName },
{ path: "/search/china", component: searchByNumber }
]
}
]
});
And if it's relevant, this is my packages.json file:
{
"name": "vmax",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
},
"dependencies": {
"axios": "^0.19.2",
"core-js": "^3.6.4",
"vue": "^2.6.11",
"vue-router": "^3.1.6",
"vuetify": "^2.2.11"
},
"devDependencies": {
"@vue/cli-plugin-babel": "~4.3.0",
"@vue/cli-plugin-eslint": "~4.3.0",
"@vue/cli-service": "~4.3.0",
"babel-eslint": "^10.1.0",
"eslint": "^6.7.2",
"eslint-plugin-vue": "^6.2.2",
"sass": "^1.19.0",
"sass-loader": "^8.0.0",
"vue-cli-plugin-vuetify": "~2.0.5",
"vue-template-compiler": "^2.6.11",
"vuetify-loader": "^1.3.0"
},
"eslintConfig": {
"root": true,
"env": {
"node": true
},
"extends": [
"plugin:vue/essential",
"eslint:recommended"
],
"parserOptions": {
"parser": "babel-eslint"
},
"rules": {}
},
"browserslist": [
"> 1%",
"last 2 versions",
"not dead"
]
}
I changed just now to port 4000 and it's working just find but something is wrong that's causing me to have to change server ports every few days.