Jump to content

game.load.shader is not a function?


Recommended Posts

Hey guys, total Phaser noob here.

I'm interested in doing shaders in Phaser, and looking at this example : http://phaser.io/examples/v2/filters/bacteria#comments  I should be able to use : game.load.shader('bacteria', 'assets/shaders/bacteria.frag'); to get my fragment shader loaded but I get a "Uncaught TypeError: game.load.shader is not a function"

Anyone ever encountered this issue? Looking in the docs it seems that load.shader is not even available. So I'm a bit confused as to why it is present on Phaser's official website.


Link to comment
Share on other sites

32 minutes ago, samme said:

Yup, that's why I really wonder why I can't get this working.


Here is my complete code mostly taken from the tutorials :


<!doctype html> 
<html lang="en"> 
	<meta charset="UTF-8" />
	<title>Phaser - Making your first game, part 1</title>
	<script type="text/javascript" src="js/phaser.min.js"></script>
    <style type="text/css">
        body {
            margin: 0;

<script type="text/javascript">

var game = new Phaser.Game(800, 600, Phaser.WEBGL, 'phaser-example', { preload: preload, create: create, update: update });
var filter;

function preload() {
    game.load.shader('simple', 'assets/shaders/simple.frag');

function create() {
    filter = new Phaser.Filter(game, null, game.cache.getShader('simple'));
    filter.addToWorld(0, 0, 800, 600);

function update() {




Link to comment
Share on other sites

3 hours ago, rich said:

What version of Phaser does it log out to the console when you run your example? If load.shader isn't found, it's likely not a new enough version.

You are right, the output version is 2.0.1. I'm guessing that the tutorials on the web are using an old version of the framework. Locally I got the latest Phaser from github, 2.6.2, now the question is, how do I make sure it uses this particular version?

Link to comment
Share on other sites

After a bit more research, it seems like the problem comes from my html file not finding the script file needed


Failed to load resource: net::ERR_FILE_NOT_FOUND    :   file://cdn.jsdelivr.net/phaser/2.6.2/phaser.min.js

I changed the script from 

<script src="//cdn.jsdelivr.net/phaser/2.6.2/phaser.min.js"></script>


<script src="http://cdn.jsdelivr.net/phaser/2.6.2/phaser.min.js"></script>

and now seems to be correct...

It's strange that the "file://" protocol would be used by default, it's even causing me issues for the call to  game.load.shader('simple', 'assets/shaders/simple.frag');

phaser.js:74719 XMLHttpRequest cannot load file:///some/path/wwwroot/Test/assets/shaders/simple.frag. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.xhr

it really should be using http since i've setuped MAMP and was able to go through all the tutorials...


EDIT : That's me being a total beginner, forgot to test my file goign through localhost:port/Project.... Hopefully it can help someone

Edited by md_lasalle
Found my issue
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...