import {Socket, Presence} from "phoenix" function not working. Phoenix/Elixir

Question

I was building a simple chat app with phoenix and elixir. One of the steps was to import Socket and Presence into the Javascript but I'm pretty sure that step is not working for reasons I have no idea about. I put this line at the top of my app.js:

import {Socket, Presence} from "phoenix"

When I debugged this line with debugger, I typed Presence in the console and it gave me a VM1416:1 Uncaught ReferenceError: Presence is not defined. Is there some setup that I could have missed? maybe with brunch or something?

You could try to do console.log(Presence) right after the import. I'm not sure if this is easily debuggagble like what you mentioned here due to how the assets are compiled. — Paweł Dawczak
give a try with import * as Phoenix from "phoenix" and use Phoenix.Presence — Ankanna

Gazler Gazler · Accepted Answer · 2017-06-23T10:11:54

The compiled code will be wrapped in an anonymous function, so the scope of Presence will not leak outside of the anonymous function.

If you want Presence to be available globally, you can do something like:

import {Socket, Presence} from "phoenix"
window.Presence = Presence;

Then it will work in your console.

You can read more about JavaScript scope in this answer https://stackoverflow.com/a/500459/219743

import {Socket, Presence} from "phoenix" function not working. Phoenix/Elixir

1 Answers