Component-preload.js is not executable (Mime type)

[RaminS]

I am trying to run my newly created Fiori app in BAS connecting to our on-premise gateway. When I do a preview in BAS (or do $npm run start) I'm getting this error in the console:

The application seems to run fine, but I still get that error. Everything in the app is pretty much as created by the template wizard, I didn't change anything in the manifest or component.js.

There seem to be other questions here about the same error message, but those scenarios are completely different from mine.

Any help would be appreciated.

Thanks in advance.

[david_bizer · Accepted solution]

Hi Ramin,

I can't give you an answer on why the template created in BAS tries to call the component-preload.js. I retested it with an freestyle template and it didn't get this error. Guess there would be more info needed on your specific scenario, which template, migration from webide/neo(?) etc.

Usually this component-preload.js file is generated on building the app to improve performance of deployed apps. If your app is deployed and you don't get an error, this means your component-preload.js file gets consumed as it should be, so everything is fine.

When running locally or in debug, the component.js file will be retrieved in most cases and not the component-preload.js. As i said, why your application tries to request that preload file in local/debug mode, I can't answer because I don't have access to all the info. But if you say that the application still runs fine in preview, even with the error, I wouldn't personally mind too much. It seems that in this case it tries to load the preload file, fails, but then still gets the component.js file to make the app work. Otherwise your app wouldn't run.

In preview you could try amending sap-ui-xx-componentPreload=off to the URL to deactivate loading component-preload.js. Then you could see if you still get that error.

[RaminS · Accepted solution]

Thanks for the explanation David.

My template was just the Fiori, Basic freestyle template.

Regardless, I will keep an eye on it and see we get the same error in future apps created in BAS.

Thanks.

[junwu]

if you check your network tab, there is 404 error for that.

you can ignore that, if you build and deploy your project(to server), the preload file will be generated, you will see that error goes away when you run with real server

[RaminS]

I did a build ($npm run build). The Component_preload.js is created in the dist folder. But I still get the error.

Are we supposed to continue getting the error until it's deployed?

[junwu]

Yes, I already said it in my first reply

[RaminS]

Yes, but you don't explain why.

When I do a build, the component_preload.js is created (it was not initially). Why would it need to be deployed? What happens when it's deployed that causes the error to go away.

[junwu]

that file is generated in dist folder, which is finally deployed to app server. when you run against the real server and the browser requests that file, your real server will easily find the file and serve you.

when you run locally, your local server is trying to look up the file under webapp folder, which doesn't have that file. that's why you get error. for your local run, you can copy that file to your webapp folder, the error will also be gone.

[RaminS]

Thanks for the explanation.

But when I look at the same application built in WebIDE, the component_preload.js is also in the dist folder, not webapp. And yet when I run it locally (sapflpsandbox)I don't get that error in WebIDE.

[junwu]

did you see the same file is requested when you run with webide????

[RaminS]

No. Why?....

why should they be different?

[junwu]

why they should be same?

[RaminS]

I am way more confused now. Thanks!

Feels like we're being punished for asking a question.