やってみる

アウトプットすべく己を導くためのブログ。その試行錯誤すらたれ流す。

Python+HTML+CSS+JSでアプリ開発〜インストール編〜《Eel》

 動いた!

インストール

 Eelをインストールする。

$ pip install eel

ログ

Looking in indexes: https://pypi.org/simple, https://www.piwheels.org/simple
Collecting eel
  Downloading https://www.piwheels.org/simple/eel/Eel-0.16.0-py3-none-any.whl (20 kB)
Requirement already satisfied: bottle in /home/pi/.anyenv/envs/pyenv/versions/3.10.5/lib/python3.10/site-packages (from eel) (0.12.25)
Collecting bottle-websocket (from eel)
  Downloading https://www.piwheels.org/simple/bottle-websocket/bottle_websocket-0.2.9-py3-none-any.whl (3.3 kB)
Collecting future (from eel)
  Downloading https://www.piwheels.org/simple/future/future-0.18.3-py3-none-any.whl (492 kB)
     ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 492.0/492.0 kB 257.3 kB/s eta 0:00:00
Collecting pyparsing (from eel)
  Downloading https://www.piwheels.org/simple/pyparsing/pyparsing-3.1.1-py3-none-any.whl (103 kB)
     ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 103.1/103.1 kB 167.4 kB/s eta 0:00:00
Collecting whichcraft (from eel)
  Downloading https://www.piwheels.org/simple/whichcraft/whichcraft-0.6.1-py2.py3-none-any.whl (5.2 kB)
Collecting gevent-websocket (from bottle-websocket->eel)
  Downloading https://www.piwheels.org/simple/gevent-websocket/gevent_websocket-0.10.1-py3-none-any.whl (22 kB)
Collecting gevent (from gevent-websocket->bottle-websocket->eel)
  Downloading gevent-23.9.1.tar.gz (5.8 MB)
     ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 5.8/5.8 MB 2.6 MB/s eta 0:00:00
  Installing build dependencies ... done
  Getting requirements to build wheel ... done
  Installing backend dependencies ... done
  Preparing metadata (pyproject.toml) ... done
Collecting zope.event (from gevent->gevent-websocket->bottle-websocket->eel)
  Downloading https://www.piwheels.org/simple/zope-event/zope.event-5.0-py3-none-any.whl (6.8 kB)
Collecting zope.interface (from gevent->gevent-websocket->bottle-websocket->eel)
  Downloading zope.interface-6.1.tar.gz (293 kB)
     ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 293.9/293.9 kB 3.9 MB/s eta 0:00:00
  Installing build dependencies ... done
  Getting requirements to build wheel ... done
  Preparing metadata (pyproject.toml) ... done
Collecting greenlet>=2.0.0 (from gevent->gevent-websocket->bottle-websocket->eel)
  Using cached greenlet-3.0.3-cp310-cp310-linux_armv7l.whl
Requirement already satisfied: setuptools in /home/pi/.anyenv/envs/pyenv/versions/3.10.5/lib/python3.10/site-packages (from zope.event->gevent->gevent-websocket->bottle-websocket->eel) (58.1.0)
Building wheels for collected packages: gevent, zope.interface
  Building wheel for gevent (pyproject.toml) ... /
done
  Created wheel for gevent: filename=gevent-23.9.1-cp310-cp310-linux_armv7l.whl size=5992280 sha256=3e9037f0af4eda00f3ffbb9807abafd7e00fac86a9de2c8b0c904782fc95e38c
  Stored in directory: /home/pi/.cache/pip/wheels/2f/75/17/17d3b59a8b03794bd25329e0d0c8c159aa921c5d1be413cf0b
  Building wheel for zope.interface (pyproject.toml) ... done
  Created wheel for zope.interface: filename=zope.interface-6.1-cp310-cp310-linux_armv7l.whl size=246444 sha256=cdd81f513ae33f582ab2c5418a57b477411946483ecce2a17c7fc37f05502df5
  Stored in directory: /home/pi/.cache/pip/wheels/be/f8/71/862f39150b828f7ba08ccf264c5ca438a13443041d85523536
Successfully built gevent zope.interface
Installing collected packages: whichcraft, zope.interface, zope.event, pyparsing, greenlet, future, gevent, gevent-websocket, bottle-websocket, eel
Successfully installed bottle-websocket-0.2.9 eel-0.16.0 future-0.18.3 gevent-23.9.1 gevent-websocket-0.10.1 greenlet-3.0.3 pyparsing-3.1.1 whichcraft-0.6.1 zope.event-5.0 zope.interface-6.1

 めちゃ時間かかった。

コード

run.py

#!/usr/bin/env python3
# coding: utf8
import eel, os
if __name__ == '__main__':
    eel.init('web')
    eel.start('index.html')

web/index.html

<head>
<script type="text/javascript" src="/eel.js"></script>
</head>

<body>
<h1><a href="https://github.com/python-eel/Eel">Eel</a>を使ってみた</h1>
<p> EelはPythonとJavaScriptを連携させるライブラリです。<br> アプリ作成するときGUIをHTML,CSS,JSで作成し、データ保存をPythonでローカルファイルとして保存する等ができることを期待して使ってみました。</p>
</body>

 404エラー。

 以下のようにすると成功した。eel.init()の引数を絶対パスにした。

run.py

#!/usr/bin/env python3
# coding: utf8
import eel, os
if __name__ == '__main__':
    eel.init(os.path.join(os.path.dirname(__file__), 'web'))
    eel.start('index.html')

web/index.html

<head>
<script type="text/javascript" src="/eel.js"></script>
</head>

<body>
<h1><a href="https://github.com/python-eel/Eel">Eel</a>を使ってみた</h1>
<p> EelはPythonとJavaScriptを連携させるライブラリです。<br> アプリ作成するときGUIをHTML,CSS,JSで作成し、データ保存をPythonでローカルファイルとして保存する等ができることを期待して使ってみました。</p>
</body>

 よっしゃ動いた!

Eelを見つけた経緯

 pywebviewを使いたかったけどGTKもQtもインストールできず使えなかったあと、類似ライブラリを探したところ、次の記事がヒット。

 ここからEelを見つけた。