a month ago
Hello everyone,
I am facing a important bug that stops my users from using my web app.
I have deployed Angular 19 SSR to a container. Often comes an error for a .js file:
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.
Here is my server.ts file:
import { APP_BASE_HREF } from '@angular/common';
import { CommonEngine, isMainModule } from '@angular/ssr/node';
import express from 'express';
import 'localstorage-polyfill';
import { dirname, join, resolve } from 'node:path';
import { fileURLToPath } from 'node:url';
import bootstrap from './src/main.server';
// The Express app is exported so that it can be used by serverless Functions.
export function app(): express.Express {
const serverDistFolder = dirname(fileURLToPath(import.meta.url));
const browserDistFolder = resolve(serverDistFolder, '../browser');
const indexHtml = join(serverDistFolder, 'index.server.html');
const server = express();
const commonEngine = new CommonEngine();
// Serve static files from /browser
server.get('**', express.static(browserDistFolder, {
maxAge: 0,
index: 'index.html'
}));
// All regular routes use the Angular engine
server.get('**', (req, res, next) => {
const { protocol, originalUrl, baseUrl, headers } = req;
commonEngine
.render({
bootstrap,
documentFilePath: indexHtml,
url: `${protocol}://${headers.host}${originalUrl}`,
publicPath: browserDistFolder,
providers: [{ provide: APP_BASE_HREF, useValue: baseUrl }],
})
.then((html) => res.send(html))
.catch((err) => next(err));
});
return server;
}
function run(): void {
if (isMainModule(import.meta.url)) {
const port = process.env['PORT'] || 8080;
// Start up the Node server
const server = app();
server.listen(port, () => {
console.log(`Node Express server listening on http://localhost:${port}`);
});
}
}
run();
My production configuratiuon in angular.json file:
"configurations": {
"production": {
"budgets": [
{
"type": "initial",
"maximumWarning": "500kB",
"maximumError": "1MB"
},
{
"type": "anyComponentStyle",
"maximumWarning": "2kB",
"maximumError": "4kB"
}
],
"outputHashing": "all",
"optimization": true,
"extractLicenses": false,
"sourceMap": false,
"namedChunks": false,
"progress": true,
"statsJson": true,
"ssr": {
"entry": "server.ts"
},
"prerender": {
"discoverRoutes": true
},
"polyfills": [
"src/polyfills.ts"
],
"styles": [
"src/styles.scss",
"src/styles/fonts.scss",
"src/styles/colors.scss",
"src/styles/forms.scss",
"node_modules/keen-slider/keen-slider.min.css"
],
"server": "src/main.server.ts",
"webWorkerTsConfig": "tsconfig.worker.json",
"aot": true
},
"development": {
"polyfills": [
"src/polyfills.ts"
],
"optimization": false,
"extractLicenses": false,
"sourceMap": true,
"aot": false,
"namedChunks": true
}
},
1 Replies
a month ago
Hey there, apologies this looks like an issue with the application level code. Due to volume, we can only answer platform level issues here. I'll leave this thread open so that the community might be able to help!
Status changed to Awaiting User Response railway[bot] • about 1 month ago