Search code examples
javascriptperlmojolicious

How to properly load Javascript files in Mojolicious perl?


I am trying to load javascript files to render graphs in the browser using Vis.JS. But it throws me an error when loading the files.

It is important to highlight that I have the necessary js files in the folder of my project.

use Mojolicious::Lite;

get '/' => 'index';

app->start;
__DATA__

@@ index.html.ep
<!DOCTYPE html>
<html>
  <head>
    <title>Echo</title>
    %= javascript 'vis.js'
    %= javascript 'jsgraphs.js'
    %= stylesheet 'vis.css'
  </head>
  <body>
    <h2>Weighted DiGraph</h2>
    <div id="graph"></div>
    %= javascript 'index.js'
</body>
</html>

The script from “http://127.0.0.1:8080/vis.js” was loaded even though its MIME type (“text/html”) is not a valid JavaScript MIME type.

Loading failed for the with source “http://127.0.0.1:8080/vis.js”. The script from “http://127.0.0.1:8080/jsgraphs.js” was loaded even though its MIME type (“text/html”) is not a valid JavaScript MIME type.

Loading failed for the with source “http://127.0.0.1:8080/jsgraphs.js”.

The script from “http://127.0.0.1:8080/index.js” was loaded even though its MIME type (“text/html”) is not a valid JavaScript MIME type

Loading failed for the with source “http://127.0.0.1:8080/index.js”.


Solution

  • Javascript files must be on the public folder in order to be seen by the browser. (The same for css or anything the browser should fetch directly)

    Probably mojolicious is sending the error 404 webpage, this can be the reason because the MIME is text/html.