Uncaught ReferenceError: mat4 is not defined even gl-Matrix library is downloaded

Question

I am building a 2d graphics engine using webgl, JavaScript and HTML, I wanted the gl-Matrix.js graphics library to do transformations so, I downloaded the lg-Matrix library zip file from their website https://glmatrix.net and extracted it into a folder called lib in my project. I didn't forgot to add the .js file to the HTML file using a script tag

<script type="text/javascript" src="src/lib/toji-gl-matrix-0bca31a/dist/gl-matrix.js"></script>

Then I call some lg-Matrix functions as follows.

    var xform = mat4.create();
    mat4.translate(xform, xform, vec3.fromValues(-0.25, 0.25, 0.0));
    mat4.rotateZ(xform, xform, 0.2); 
    mat4.scale(xform, xform, vec3.fromValues(1.2, 1.2, 1.0));
    
    this.mWhiteSq.draw(xform);

this.mWhiteSq is a function that draws a white square to the middle of the canvas, It is also applies the given transformations.

The problem is JavaScript console in the browser prints the error massage mentioned in the title. It says that mat4 is not defined.

Answer 1

Hey I just discovered that the problem can be solved by using glMatrix.mat4.create() instead of just using mat4.create() . It's the same for every other function.