1

I deployed my app to render and it worked fine for one day but after that I’ve got and error in console.

Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec.

I checked the paths and still no progress in solving it, sitting second day on it and trying to fix. I would appreciate any help

This is my vite config

export default defineConfig({
  plugins: [react()],
  base: "/",
  server: {
    proxy: {
      "/api": {
        target: "http://localhost:3003",
        changeOrigin: true,
      },
    },
  },
});

This is my app.js in node

const express = require("express");
const app = express();
const cors = require("cors");
const userController = require("./controllers/user");
const loginController = require("./controllers/login");
const taskController = require("./controllers/task");
require("dotenv").config();
const mongoose = require("mongoose");
const path = require("path");

app.use(express.json());
app.use(cors());

// MongoDB connection
const dbPassword = process.env.DB_PASSWORD;
const dbUrl = process.env.DB_URL.replace("<db_password>", dbPassword);

mongoose.set("strictQuery", false);
console.log(`Connecting to ${dbUrl}`);

mongoose
  .connect(dbUrl)
  .then(() => {
    console.log("connected to MongoDB");
  })
  .catch((error) => console.log("Error connecting to mongo DB", error.message));

app.use(express.static(path.join(__dirname, "dist")));

// Serve index.html for non-API and non-static file requests (for client-side routing)
app.get("*", (req, res) => {
  res.sendFile(path.join(__dirname, "dist", "index.html"));
});

// API Routes
app.use("/api/user", userController);
app.use("/api/login", loginController);
app.use("/api/new-task", taskController);

// Serve static files from 'dist' directly without '/api' path

// Error handling middleware
app.use((err, req, res, next) => {
  console.log(err.stack);
  if (err.name === "ValidationError") {
    const errorMessage = err.details.map((detail) => detail.message).join(", ");
    return res.status(400).json({ message: errorMessage });
  }
  if (err.statusCode) {
    return res.status(err.statusCode).json({ message: err.message });
  }
  res.status(500).json({ message: "Internal server Error" });
});

module.exports = app;

5
  • Thanks. Possible duplicate: stackoverflow.com/q/72070748/519413 Commented Nov 8, 2024 at 10:20
  • Also stackoverflow.com/a/78723805/519413 Commented Nov 8, 2024 at 10:21
  • And stackoverflow.com/a/76324477/519413 Commented Nov 8, 2024 at 10:21
  • thank you for response, I still didn't catch the issue but thank you for your reply :) Commented Nov 8, 2024 at 11:05
  • Your index.html surely is referencing some JS or CSS files. Your backend has no way of providing those, because for every request, which is not one of your defined routes you always return index.html file Commented Nov 9, 2024 at 14:06

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.