Vue.js with Eel

Describe the problem I’m trying to create an app using Vue.js as fronted with Eel. However after following some other issues here on github I’m stuck with the following error: error 'eel' is not defined no-undef

I put the Eel.js as src in my index.html file:

<script type='text/javascript' src='http://localhost:8080/eel.js'></script>

Here is main.py eel file:

import eel
import threading
import sampling
from subprocess import call
from time import sleep


def start_web():
    call(['./start.sh'])


def start_eel():
    sleep(7)
    eel.init('VueApp', allowed_extensions=['.js', '.html', '.vue'])
    eel.start('', options={
        'port': 8080,
        'host': 'localhost',
    })


if __name__ == '__main__':
    t1 = threading.Thread(target=start_web)
    t2 = threading.Thread(target=start_eel)
    t1.start()
    t2.start()

So Im running the app in dev mode, as sugested in another issue here.

Here is my start.sh file:

cd VueApp
npm run dev

The thing is I’m stuck what else I should do. Is there a place I should somehow import Eel into Vue that I’m missing? My Vue app is running on port 8686 because if I set it to run on same port I get OSError in eel, not sure if that is correct.

I think you guys managed to get this work, could you please share what should I do to make Vue recognize eel? @hiancdtrsnm @alexwohlbruck @ahopkins

[alexwohlbruck]

The selected port doesnt matter, as long as they are the same. I try to keep it on something relatively unique in case another local server is running on that port.

Also, forgot to mention. To use the eel object in js, I just referenced window.eel and it works just fine. I cannot find any way to import it with an es6 import statement.

You can reference the code in my project.

[luciferamji]

yeah @alexwohlbruck i forgot to mention the port numberin index.html i checked . Your code really helped.