I am getting unknown file extension error while importing a js file in app.js, using type: module in package.json

Question

I am getting an error while calling a file from routes folder in the main server file.

app.js(main server file code)

import express from "express"
import cors from "cors"
import mysql from "mysql"
const app = express()
import bcrypt from "bcrypt"
import session from "express-session"
import passport from "passport"
import passportLocalMySql from "passport-local-mysql"

app.use(cors())
app.use(express.json())
app.use(express.urlencoded({ extended: true }))

const db = mysql.createPool({
    host: 'localhost',
    user: 'root',
    password: '25432900@Meet',
    database: 'quizdb'
})

app.post("/register", cors(), (req, res) => {
    console.log("In server", req.body)
    let userName = req.body.userName
    let userEmail = req.body.userEmail
    const sqlInsert = "INSERT INTO user(user_name, user_email) VALUES (?,?)"
    // const sqlRead = "SELECT * from user"
    const queryResult = db.query(sqlInsert, [userName, userEmail], (err, result) => {
        if (err) {
            console.log("There was some error: ", err)
        } else {
            console.log("Successful")
            res.json(result)
        }
    })
})

import router from "./routes/login"
console.log("Meeet")
app.post("/login", async (req, res) => {
    let userName = req.body.userName
    let userPassword = req.body.password
    const checkQuery = 'SELECT * FROM user WHERE user_id=? AND user_password=?'
    const queryResult = db.query(checkQuery, [userName, userPassword], (err, result) => {
        if (err) {
            console.log("There was some error: ", err)
        } else {
            console.log("Successful")
            res.json(result)
        }
    })
})

app.listen('5000', () => {
    console.log("Listening on port no. 5000")
})

login.js file(the file which is being imported)

const express = require("express")
const router = express.Router()

router.post("/login", async (req, res) => {
    console.log("Meets")
    let userName = req.body.userName
    let userPassword = req.body.password
    const checkQuery = 'SELECT * FROM user WHERE user_id=? AND user_password=?'
    const queryResult = db.query(checkQuery, [userName, userPassword], (err, result) => {
        if (err) {
            console.log("There was some error: ", err)
        } else {
            console.log("Successful")
            res.json(result)
        }
    })
})

module.exports = router

package.json file

{
  "name": "app",
  "version": "1.0.0",
  "description": "",
  "main": "app.js",
  "type": "module",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "node app",
    "nodemon": "nodemon app"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "bcrypt": "^5.1.0",
    "cors": "^2.8.5",
    "express": "^4.18.2",
    "express-session": "^1.17.3",
    "mysql": "^2.18.1",
    "passport": "^0.6.0",
    "passport-local": "^1.0.0",
    "passport-local-mysql": "^5.0.10",
    "sequelize": "^6.26.0",
    "sequelize-cli": "^6.5.2"
  },
  "devDependencies": {
    "nodemon": "^2.0.20"
  }
}

file structure:

1. app.js, package.json inside main folder
2. login.js inside router folder inside main folder

I am trying to use esversion 6 but it is throwing an error

Error:

`TypeError [ERR_UNKNOWN_FILE_EXTENSION]: Unknown file extension "" for M:\react\quiz-app\server\routes\login. Loading extensionless files is not supported inside of "type":"module" package.json contexts. The package.json file M:\react\quiz-app\server\package.json caused this "type":"module" context. Try changing M:\react\quiz-app\server\routes\login to have a file extension. Note the "bin" field of package.json can point to a file with an extension, for example {"type":"module","bin":{"login":".\routes\login.js"}}
    at new NodeError (node:internal/errors:393:5)
    at Object.getFileProtocolModuleFormat [as file:] (node:internal/modules/esm/get_format:80:11)
    at defaultGetFormat (node:internal/modules/esm/get_format:122:38)
    at defaultLoad (node:internal/modules/esm/load:81:20)
    at nextLoad (node:internal/modules/esm/loader:164:28)
    at ESMLoader.load (node:internal/modules/esm/loader:603:26)
    at ESMLoader.moduleProvider (node:internal/modules/esm/loader:459:22)
    at new ModuleJob (node:internal/modules/esm/module_job:63:26)
    at #createModuleJob (node:internal/modules/esm/loader:478:17)
    at ESMLoader.getModuleJob (node:internal/modules/esm/loader:436:34) {
  code: 'ERR_UNKNOWN_FILE_EXTENSION'
}

Node.js v18.8.0`

Answer 1

If you are using ESM and commonJS modules with the same file extension, it won't work. You should rename login.js to login.cjs and then change the line import router from "./routes/login" to import * as router from "./routes/login.cjs" . It should help.

Or just use only ESM modules everywhere in the project.