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;
index.htmlsurely 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 returnindex.htmlfile