react project compiles but not working - node.js

Question

I am on my reactjs project. I run gulp command to compile the project. During compile i get few errors and still the project compiles succcessfully. But I am not able to run my application. I am sure it is because of compile errors.
This is my compile console
Apurvs-MacBook-Pro:tessact-client-2 apurvgandhwani$ gulp
[01:52:51] Failed to load external module #babel/register
[01:52:51] Requiring external module babel-register
[01:52:54] Using gulpfile ~/Desktop/tessact-client-2/tessact-client-2/gulpfile.babel.js
[01:52:54] Starting 'build:watch'...
[01:52:54] Starting 'copy:assets'...
[01:52:54] Starting 'copy:vendors'...
Cleaned build/
Copied 14 asset entries.
[01:52:54] Finished 'copy:vendors' after 157 ms
[01:52:54] Starting 'copy:views'...
[01:52:54] copied views all files 1.79 kB
[01:52:54] Finished 'copy:views' after 60 ms
[01:52:54] Starting 'copy:public'...
[01:52:54] Finished 'copy:public' after 29 ms
[01:52:54] Finished 'copy:assets' after 248 ms
[01:52:54] Starting 'bundle:dll'...
DLL Bundled.
Hash: 0c28a0c5268f8a4b023c
Version: webpack 1.15.0
Time: 2362ms
Asset Size Chunks Chunk Names
dll.vendor.js 3.16 MB 0 [emitted] vendor
[01:52:57] Finished 'bundle:dll' after 2.4 s
[01:52:57] Starting 'bundle'...
Hash: d2622522a127e8235b84
Version: webpack 1.15.0
Time: 641ms
Asset Size Chunks Chunk Names
server-bundle.js 65 kB 0 [emitted] main
-- server:watch bundled.
Hash: b86595a12c8058d77ded
Version: webpack 1.15.0
Time: 6049ms
Asset Size Chunks Chunk Names
00103e881a36640a08f869ff6888f0fd.eot 5.9 kB [emitted]
main-bundle.js 3.13 MB 0 [emitted] main
-- client bundled.
[01:53:03] Finished 'bundle' after 6.05 s
[01:53:03] Starting 'start:server'...
Starting Node Server...
[01:53:03] Finished 'start:server' after 147 ms
[01:53:03] Starting 'watch:sync'...
[01:53:03] [nodemon] 1.14.11
[01:53:03] [nodemon] to restart at any time, enter `rs`
[01:53:03] [nodemon] watching: build/server-bundle.js
[01:53:03] [nodemon] starting `node --debug --inspect build/server-bundle.js`
Server Restarted: Reloading BrowserSync.
Debugger listening on ws://127.0.0.1:9229/c6e6fdcb-9801-4097-b9cb-7480c39f4380
For help see https://nodejs.org/en/docs/inspector
[tessact: ] Proxying: http://localhost:4200
[tessact: ] Access URLs:
-------------------------------------
Local: http://localhost:3000
External: http://192.168.0.32:3000
-------------------------------------
UI: http://localhost:3001
UI External: http://192.168.0.32:3001
-------------------------------------
[tessact: ] Watching files...
[01:53:03] Finished 'watch:sync' after 224 ms
[01:53:03] Starting 'watch:assets'...
[01:53:03] Finished 'watch:assets' after 14 ms
[01:53:03] Finished 'build:watch' after 9.09 s
[01:53:03] Starting 'default'...
[01:53:03] Finished 'default' after 28 μs
tessact:db DBERROR: connect ECONNREFUSED 127.0.0.1:3306 +0ms
ServerStartupError: { Error: connect ECONNREFUSED 127.0.0.1:3306
at Object._errnoException (util.js:1003:13)
at _exceptionWithHostPort (util.js:1024:20)
at TCPConnectWrap.afterConnect [as oncomplete] (net.js:1194:14)
at Protocol._enqueue (/Users/apurvgandhwani/Desktop/tessact-client-2/tessact-client-2/node_modules/mysql/lib/protocol/Protocol.js:145:48)
at Protocol.handshake (/Users/apurvgandhwani/Desktop/tessact-client-2/tessact-client-2/node_modules/mysql/lib/protocol/Protocol.js:52:23)
at Connection.connect (/Users/apurvgandhwani/Desktop/tessact-client-2/tessact-client-2/node_modules/mysql/lib/Connection.js:130:18)
at /Users/apurvgandhwani/Desktop/tessact-client-2/tessact-client-2/build/webpack:/src/server/db.js:26:14
From previous event:
at initDB (/Users/apurvgandhwani/Desktop/tessact-client-2/tessact-client-2/build/webpack:/src/server/db.js:25:9)
at Object.defineProperty.value (/Users/apurvgandhwani/Desktop/tessact-client-2/tessact-client-2/build/webpack:/src/server/app.js:27:1)
at __webpack_require__ (/Users/apurvgandhwani/Desktop/tessact-client-2/tessact-client-2/build/webpack:/webpack/bootstrap d2622522a127e8235b84:19:1)
at Object.<anonymous> (/Users/apurvgandhwani/Desktop/tessact-client-2/tessact-client-2/build/server-bundle.js:48:19)
at __webpack_require__ (/Users/apurvgandhwani/Desktop/tessact-client-2/tessact-client-2/build/webpack:/webpack/bootstrap d2622522a127e8235b84:19:1)
at /Users/apurvgandhwani/Desktop/tessact-client-2/tessact-client-2/build/webpack:/webpack/bootstrap d2622522a127e8235b84:39:1
at Object.<anonymous> (/Users/apurvgandhwani/Desktop/tessact-client-2/tessact-client-2/build/server-bundle.js:44:10)
at Module._compile (module.js:660:30)
at Object.Module._extensions..js (module.js:671:10)
at Module.load (module.js:573:32)
at tryModuleLoad (module.js:513:12)
at Function.Module._load (module.js:505:3)
at Function.Module.runMain (module.js:701:10)
at startup (bootstrap_node.js:193:16)
at bootstrap_node.js:617:3
errno: 'ECONNREFUSED',
code: 'ECONNREFUSED',
syscall: 'connect',
address: '127.0.0.1',
port: 3306,
fatal: true }
[tessact: ] Reloading Browsers...
[01:53:05] [nodemon] clean exit - waiting for changes before restart
webpack built b86595a12c8058d77ded in 3199ms
Hash: b86595a12c8058d77ded
Version: webpack 1.15.0
Time: 3199ms
Asset Size Chunks Chunk Names
00103e881a36640a08f869ff6888f0fd.eot 5.9 kB [emitted]
main-bundle.js 3.13 MB 0 main
webpack: Compiled successfully.
There is an error in the starting and one in the middle of the snippet.
This is my config.js file
const IS_PROD = (process.env.NODE_ENV === "production");
// const IS_PROD = false;
const NODE_PORT = 4211;
const BS_PORT = 3002;
module.exports = {
NODE_PORT,
BS_PORT,
SESSION_SECRET: 't355#c7_S3cr37',
LOGIN_URL: "https://www.backend.trigger.tessact.com/auth/login/",
DB: {
production: {
host: 'localhost',
port: 3306,
user: 'root',
password: '',
database: 'tessact_db'
},
development: {
host: 'localhost',
port: 3306,
user: 'root',
password: '',
database: 'tessact_db'
}
},
ACL_POPULATION_URL: '/populate',
ACL_UPDATE_URL: '/update-acl-population'
}
This is my configure.js file
import express from 'express'
import path from 'path'
import favicon from 'serve-favicon'
import logger from 'morgan'
import cookieParser from 'cookie-parser'
import bodyParser from 'body-parser'
import compression from 'compression'
import session from 'express-session'
import config from './config'
import getRoutes from './routes'
const IS_PROD = process.env.NODE_ENV === 'production';
export default function configureServer(db, app){
const loggerMode = IS_PROD ? 'combined' : 'dev'
const env = IS_PROD ? 'production' : 'development'
const MySQLStore = require('express-mysql-session')(session)
app.set('env', env);
app.use(logger(loggerMode));
// Pretty prints template output
if (!IS_PROD) {
app.locals.pretty = true;
}
// Where to find templates
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));
app.use(compression());
// Server static assets from this directory
app.use('/public',
express.static( path.resolve(__dirname, './public'))
);
// Should come after static assets
// Otherwise static requests will be treated with cookies and session as well
app.use(cookieParser(config.SESSION_SECRET));
app.use(
session({
resave: true,
saveUninitialized: true,
secret: config.SESSION_SECRET,
store: new MySQLStore({}, db)
})
)
// Add routes
app.use('/', getRoutes(db, app));
// catch 404 and forward to error handler
app.use(function(req, res, next) {
var err = new Error('Not Found');
err.status = 404;
next(err);
});
// error handlers
// development error handler
// will print stacktrace
if (app.get('env') === 'development') {
app.use(function(err, req, res, next) {
res.status(err.status || 500);
res.render('error', {
message: err.message,
error: err
});
});
}
// production error handler
// no stacktraces leaked to user
app.use(function(err, req, res, next) {
res.status(err.status || 500);
res.render('error', {
message: err.message,
error: {}
});
});
return Promise.resolve({db, app})
}
This is my db.js
import Promise from 'bluebird';
import config from './config';
import mysql from 'mysql';
var debug = require('debug')('tessact:db');
const IS_PROD = (process.env.NODE_ENV !== "production");
const connOptions = config.DB[
IS_PROD ? 'production' : 'development'
]
var connection = mysql.createConnection(connOptions)
process.on('SIGTERM', ()=> {
connection.end(err=> {
if (error){
console.error(err);
}
debug('DB Closed');
})
});
const initDB = ()=> {
return new Promise((resolve, reject)=>{
connection.connect(err => {
if (err){
debug('DBERROR: ', err.message)
return reject(err)
}
debug('Connected')
resolve(connection)
})
});
}
export default initDB;

Answer 1

Your application fails to connect to the database (I assume mysql). It tries to connect to localhost:3306 and gets connect ECONNREFUSED 127.0.0.1:3306 which usually means there is no mysql listening on this server.
You should either start mysql on the same machine, or configure your application to connect to a remote mysql.
It is also possible that you have a database running but listening on a different port or network-interface.