How to import external libraries and Python script in pyscript
Pyscript is a framework that allows us to run python scripts in HTML documents. Python has many useful libraries like NumPy, matplotlib, and TensorFlow, which we use to perform many useful tasks.
Pyscript only supports Python and its built-in libraries such as random. We can not use external libraries in the <py-script> tag where we can import. Also, external libraries need installation before using them in our python scripts.
External libraries
We can use python external libraries in our HTML documents using pyscript. First, we need to install those libraries in our system using the pip command. The following is the syntax for installing libraries:
pip install library_name
The above command automatically sets the library to the environment path of the operating system. After installing all the desired libraries, we can access these libraries through the PyScript tag py-env declared in the head tag of the HTML document.
Syntax
The following is the syntax to access external libraries using the py-env tag:
<py-env>
- library_name
- library_name
...
...
...
</py-env>
As we want to use the library_name as the external library, so we have downloaded it beforehand. We can import as many libraries as we want.
Code example
The following example shows how we can import external libraries in Pyscript using py-env tag:
Code explanation
Lines 6 and 7: We import PyScript using CDN in the
<head>tag of the HTML documentLines 9 to 11: We use the
py-envtag of PyScript, we import matplotlib for pyscript use.Lines 17 to 31: We write a simple Python script that imports matplotlib and draws a graph on the browser.
Import functions from an external file
Python script can be long with classes and functions. It is difficult to have all the code within a pyscript tag in a single HTML document. To save ourselves from this, we can also import functions from an external Python file and use them in pyscript directly without implementing them in pyscript tag.
Syntax
The syntax to import Python files in pyscript using <py-env> tag is the following:
<py-env>
- paths:
- directory_to_py_file
- ./file_name.py
</py-env>Code example
The following example will demonstrate how we can import functions from the python file to the HTML file in PyScript:
<html>
<head>
<link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
<script defer src="https://pyscript.net/alpha/pyscript.js"></script>
<py-env>
- paths:
- ./example.py
</py-env>
</head>
<body>
<h1>Let's print random numbers</h1>
<b> <label id="lucky"></label></b>
<py-script>
from example import generate_random_password
pyscript.write('lucky', generate_random_password())
</py-script>
</body>
</html>
Code explanation
The above example has two files in the directory; one python script, which has all the declarations of the function, other is an HTML document that imports a function from a Python file. It prints a random password in the browser.
