0

I am learning MERN application development. I got a incomplete MERN application and trying to run the application. My package.json file is like below.

package.json

{
  "name": "machine-shop",
  "version": "1.0.0",
  "private": true,
  "type": "module",
  "scripts": {
    "build": "node ace build --production",
    "start": "node server.js",
    "dev": "node ace serve --watch",
    "lint": "eslint . --ext=.ts",
    "format": "prettier --write ."
  },
  "devDependencies": {
    "@adonisjs/assembler": "^5.0.0",
    "@babel/core": "^7.14.3",
    "@babel/preset-react": "^7.13.13",
    "@symfony/webpack-encore": "^1.4.0",
    "@types/node": "^16.3.3",
    "adonis-preset-ts": "^2.1.0",
    "autoprefixer": "^10.2.6",
    "eslint": "^7.27.0",
    "eslint-config-prettier": "^8.3.0",
    "eslint-plugin-adonis": "^1.3.1",
    "eslint-plugin-prettier": "^3.4.0",
    "node-pre-gyp": "^0.17.0",
    "pino-pretty": "^5.0.1",
    "postcss": "^8.3.0",
    "postcss-loader": "^5.3.0",
    "prettier": "^2.3.0",
    "sass": "^1.34.0",
    "sass-loader": "^11.1.1",
    "tailwindcss": "^2.1.2",
    "typescript": "~4.2",
    "youch": "^2.2.2",
    "youch-terminal": "^1.1.1"
  },
  "dependencies": {
    "-": "^0.0.1",
    "@adonisjs/auth": "^8.0.4",
    "@adonisjs/core": "^5.1.0",
    "@adonisjs/lucid": "^14.1.0",
    "@adonisjs/repl": "^3.0.0",
    "@adonisjs/session": "^6.0.0",
    "@adonisjs/shield": "^7.0.0",
    "@adonisjs/view": "^6.0.0",
    "@ckeditor/ckeditor5-build-decoupled-document": "^28.0.0",
    "@ckeditor/ckeditor5-react": "^3.0.2",
    "@date-io/date-fns": "2.6.1",
    "@formatjs/intl-pluralrules": "1.3.5",
    "@fortawesome/fontawesome-free": "5.13.0",
    "@manaflair/redux-batch": "1.0.0",
    "@material-ui/core": "4.9.14",
    "@material-ui/icons": "4.9.1",
    "@material-ui/lab": "4.0.0-alpha.53",
    "@material-ui/pickers": "3.2.10",
    "@material-ui/styles": "4.9.14",
    "@reduxjs/toolkit": "^1.6.1",
    "@tanem/svg-injector": "8.0.50",
    "apexcharts": "^3.27.2",
    "axios": "^0.21.1",
    "axios-mock-adapter": "1.18.1",
    "bootstrap": "4.6.0",
    "camelcase": "^5.2.0",
    "clipboard-copy": "3.1.0",
    "clsx": "1.1.0",
    "cp-cli": "2.0.0",
    "css-mediaquery": "^0.1.2",
    "date-fns": "2.8.1",
    "dotenv": "^10.0.0",
    "dotenv-expand": "5.1.0",
    "downshift": "3.4.2",
    "fg-loadcss": "^3.1.0",
    "force": "^0.0.3",
    "formik": "2.1.4",
    "holderjs": "^2.9.9",
    "json2mq": "^0.2.0",
    "luxon": "^1.27.0",
    "material-ui-popup-state": "^1.8.3",
    "mysql": "^2.18.1",
    "object-path": "^0.11.5",
    "phc-argon2": "^1.1.1",
    "phc-bcrypt": "^1.0.7",
    "prop-types": "^15.7.2",
    "proxy-addr": "^2.0.7",
    "react": "^17.0.2",
    "react-app-polyfill": "^1.0.4",
    "react-bootstrap": "1.0.1",
    "react-bootstrap-table-next": "4.0.2",
    "react-bootstrap-table2-paginator": "2.1.2",
    "react-datepicker": "2.16.0",
    "react-dev-utils": "^9.1.0",
    "react-dom": "^17.0.2",
    "react-draggable": "4.4.2",
    "react-dropzone": "^11.3.4",
    "react-inlinesvg": "1.2.0",
    "react-intl": "3.6.2",
    "react-is": "16.13.1",
    "react-perfect-scrollbar": "1.5.8",
    "react-portal": "4.2.0",
    "react-redux": "7.1.3",
    "react-router-dom": "^5.2.0",
    "react-select": "3.1.0",
    "react-slick": "^0.28.1",
    "react-swipeable-views": "0.13.9",
    "react-syntax-highlighter": "12.2.1",
    "react-tinder-card": "^1.4.0",
    "react-window": "1.8.5",
    "redux": "4.0.5",
    "redux-persist": "6.0.0",
    "redux-saga": "1.1.3",
    "reflect-metadata": "^0.1.13",
    "socicon": "3.0.5",
    "source-map-support": "^0.5.19",
    "sweetalert2": "^11.0.11",
    "yup": "^0.32.9"
  }
}

My server.js file is like below

server.js

import 'reflect-metadata';
import sourceMapSupport from 'source-map-support';
import { Ignitor } from '@adonisjs/core/build/standalone';

sourceMapSupport.install({ handleUncaughtExceptions: false })

new Ignitor(__dirname).httpServer().start()

I am trying to run the application using npm start command. But I am getting below error.

file:///home/foysal/Music/machineshop/server.js:20
new Ignitor(__dirname).httpServer().start()
            ^

ReferenceError: __dirname is not defined in ES module scope
This file is being treated as an ES module because it has a '.js' file extension and '/home/foysal/Music/machineshop/package.json' contains "type": "module". To treat it as a CommonJS script, rename it to use the '.cjs' file extension.
    at file:///home/foysal/Music/machineshop/server.js:20:13

enter image description here

What is the meaning of this code new Ignitor(__dirname).httpServer().start() ? Is it correct code ?

Previously I worked in another MERN application. server.js file of that project is not similar like server.js file of this project.

Am I doing anything wrong ?

Could any one help me to run the application ?

abu abu
  • 6,599
  • 19
  • 74
  • 131
  • 1
    Does this answer your question? [\_\_dirname is not defined in Node 14 version](https://stackoverflow.com/questions/64383909/dirname-is-not-defined-in-node-14-version) – funkizer Jul 24 '21 at 13:35
  • Thanks @funkizer. No. This doesn't answer my question. I would like to run the app. Thanks. – abu abu Jul 24 '21 at 13:43
  • 1
    Yes it does. Did you read your error? __dirname is not defined so you need to find the path to your server.js using other methods – funkizer Jul 24 '21 at 13:50
  • Thanks @funkizer. How can I find the path to my `server.js` using other methods ? – abu abu Jul 24 '21 at 14:16

1 Answers1

2

You have mixed up client and server. Usually you keep them separated when you work on stacks like that - in separate repositories or at least in separate directories. You have 2 ways as I see:

  • Separate client and server dependencies
  • Use Adonis to serve the React app

I would take the first path for better maintainability. If that seems too complicated, you can take the later one for now and keep working on separation down the road. For that you may wanna look into this document.

msrumon
  • 1,250
  • 1
  • 10
  • 27