Skip to content

Commit 11c2783

Browse files
synwsynw
committed
Initial
1 parent 315f04b commit 11c2783

36 files changed

+1023
-0
lines changed

‎.gitignore

+31
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
node_modules
2+
.DS_Store
3+
dist
4+
dist-ssr
5+
*.local
6+
yarn.lock
7+
8+
# Logs
9+
logs
10+
*.log
11+
npm-debug.log*
12+
yarn-debug.log*
13+
yarn-error.log*
14+
pnpm-debug.log*
15+
lerna-debug.log*
16+
17+
node_modules
18+
dist
19+
dist-ssr
20+
*.local
21+
22+
# Editor directories and files
23+
.vscode/*
24+
!.vscode/extensions.json
25+
.idea
26+
.DS_Store
27+
*.suo
28+
*.ntvs*
29+
*.njsproj
30+
*.sln
31+
*.sw?

‎README.md

+103
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,103 @@
1+
# Use Python
2+
3+
[![pub package](https://img.shields.io/npm/v/usepython)](https://www.npmjs.com/package/usepython)
4+
5+
A Python scripts runner composable. Run Python scripts in a [Pyodide](https://github.com/pyodide/pyodide) service worker
6+
7+
## Install
8+
9+
### As a package
10+
11+
```bash
12+
npm install usepython
13+
# or
14+
yarn add usepython
15+
```
16+
17+
Then use it:
18+
19+
```ts
20+
import { usePython } from "usepython";
21+
22+
const py = usePython();
23+
```
24+
25+
### As script src
26+
27+
```html
28+
<script src="https://unpkg.com/[email protected]/dist/py.min.js"></script>
29+
<script>
30+
const py = $py.usePython();
31+
</script>
32+
```
33+
34+
### As script type module
35+
36+
```html
37+
<script type="module">
38+
import { usePython } from "https://unpkg.com/[email protected]/dist/py.esm.js";
39+
const py = usePython();
40+
</script>
41+
```
42+
43+
## Usage
44+
45+
### Load the runtime
46+
47+
Load the Python runtime:
48+
49+
```ts
50+
await py.load()
51+
```
52+
53+
Listen to the install log:
54+
55+
```ts
56+
const unbindInstallLog = py.installLog.listen((val) => {
57+
console.log(`Installing Python, stage ${val.stage}: ${val.msg}`)
58+
})
59+
await py.load();
60+
unbindInstallLog();
61+
```
62+
63+
### Load libraries
64+
65+
It is possible to install some Python packages: either [packages built for Pyodide](https://pyodide.org/en/stable/usage/packages-in-pyodide.html#packages-in-pyodide), standard pip packages that will be installed with Micropip, or custom wheels
66+
67+
```ts
68+
const wheel = '/acustomwheel-0.0.1-py3-none-any.whl';
69+
const pyodideLibs = ['pandas', 'numpy', 'bokeh'];
70+
await py.load(pyodideLibs, ['altair', wheel, 'vega_datasets'])
71+
```
72+
73+
### Run Python code
74+
75+
Run some Python code:
76+
77+
```ts
78+
const script = `a=1
79+
b=2
80+
a+b`
81+
const { result, error } = await py.run("script1", script);
82+
```
83+
84+
The result is the last line of the script, just like a return value
85+
86+
### Listen to stdout
87+
88+
Listen to the Python stdout output:
89+
90+
```ts
91+
const script = `print('ok from python')`;
92+
py.log.listen((val) => {
93+
console.log("LOG", val.stdOut)
94+
// val.stdErr is also available
95+
});
96+
await py.run("script2", script);
97+
```
98+
99+
## Examples
100+
101+
- [Script src](examples/umd/)
102+
- [Script module](examples/esm/)
103+
- [Vuejs](examples/vuejs/)

‎examples/esm/README.md

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
# Use Python esm example
2+
3+
```bash
4+
cd examples/esm
5+
# run
6+
yarn dev
7+
```
8+
9+
Open localhost:5173

‎examples/esm/index.html

+30
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<title>Use Python ESM example</title>
7+
</head>
8+
<body>
9+
<script>
10+
window.process = {env: {NODE_ENV: 'production'}};
11+
</script>
12+
<script type="module">
13+
import { usePython } from "https://unpkg.com/[email protected]/dist/py.esm.js";
14+
const py = usePython();
15+
const unbindInstallLog = py.installLog.listen((val) => {
16+
console.log(`Installing Python, stage ${val.stage}: ${val.msg}`)
17+
})
18+
await py.load();
19+
unbindInstallLog();
20+
console.log("Python is ready");
21+
py.log.listen((val) => {
22+
console.log("LOG", val.stdOut)
23+
});
24+
const script = `print('ok from python')`;
25+
const { result, error } = await py.run("1", script);
26+
console.log("Error", error);
27+
console.log("Result", result);
28+
</script>
29+
</body>
30+
</html>

‎examples/esm/package.json

+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
{
2+
"name": "esm",
3+
"private": true,
4+
"version": "0.0.0",
5+
"type": "module",
6+
"scripts": {
7+
"dev": "vite",
8+
"build": "vite build",
9+
"preview": "vite preview"
10+
},
11+
"devDependencies": {
12+
"vite": "^3.0.7"
13+
}
14+
}

‎examples/umd/README.md

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
# Use Python umd example
2+
3+
```bash
4+
cd examples/umd
5+
# run
6+
yarn dev
7+
```
8+
9+
Open localhost:5173

‎examples/umd/index.html

+32
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<title>Use Python UMD example</title>
7+
</head>
8+
<body>
9+
<script>
10+
window.process = {env: {NODE_ENV: 'production'}};
11+
</script>
12+
<script src="https://unpkg.com/[email protected]/dist/py.min.js"></script>
13+
<script>
14+
const py = $py.usePython();
15+
const unbindInstallLog = py.installLog.listen((val) => {
16+
console.log(`Installing Python, stage ${val.stage}: ${val.msg}`)
17+
});
18+
py.log.listen((val) => {
19+
console.log("LOG", val.stdOut)
20+
});
21+
py.load().then(() => {
22+
unbindInstallLog();
23+
console.log("Python is ready");
24+
const script = `print('ok from python')`;
25+
py.run("1", script).then((res) => {
26+
console.log("Error", res.error);
27+
console.log("Result", res.result);
28+
});
29+
});
30+
</script>
31+
</body>
32+
</html>

‎examples/umd/package.json

+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
{
2+
"name": "esm",
3+
"private": true,
4+
"version": "0.0.0",
5+
"type": "module",
6+
"scripts": {
7+
"dev": "vite",
8+
"build": "vite build",
9+
"preview": "vite preview"
10+
},
11+
"devDependencies": {
12+
"vite": "^3.0.7"
13+
}
14+
}

‎examples/vuejs/.gitignore

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
node_modules
2+
.DS_Store
3+
dist
4+
dist-ssr
5+
!/doc/dist
6+
*.local
7+
yarn.lock
8+
yarn-error.log
9+
.yarnrc
10+
/dev
11+
.vscode

‎examples/vuejs/LICENSE

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
MIT License
2+
3+
Copyright (c) 2022 synw
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in all
13+
copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21+
SOFTWARE.

‎examples/vuejs/README.md

+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
# Use Python vuejs example
2+
3+
## Install
4+
5+
Install the dependencies:
6+
7+
```
8+
yarn
9+
```
10+
11+
## Run
12+
13+
```
14+
yarn dev
15+
```
16+
17+
Open localhost:3000

‎examples/vuejs/components.d.ts

+24
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
// generated by unplugin-vue-components
2+
// We suggest you to commit this file into source control
3+
// Read more: https://github.com/vuejs/vue-next/pull/3399
4+
5+
declare module 'vue' {
6+
export interface GlobalComponents {
7+
HelloWorld: typeof import('./src/components/HelloWorld.vue')['default']
8+
'ICil:mediaPlay': typeof import('~icons/cil/media-play')['default']
9+
IClaritySettingsLine: typeof import('~icons/clarity/settings-line')['default']
10+
'IFaSolid:angleDoubleLeft': typeof import('~icons/fa-solid/angle-double-left')['default']
11+
'IFaSolid:angleDoubleRight': typeof import('~icons/fa-solid/angle-double-right')['default']
12+
'IFaSolid:moon': typeof import('~icons/fa-solid/moon')['default']
13+
'IFaSolid:sun': typeof import('~icons/fa-solid/sun')['default']
14+
'IFileIcons:configPython': typeof import('~icons/file-icons/config-python')['default']
15+
'IFileIcons:testPython': typeof import('~icons/file-icons/test-python')['default']
16+
IFluentSettings32Regular: typeof import('~icons/fluent/settings32-regular')['default']
17+
IIonArrowBackOutline: typeof import('~icons/ion/arrow-back-outline')['default']
18+
'IMdi:languagePython': typeof import('~icons/mdi/language-python')['default']
19+
TheHeader: typeof import('./src/components/TheHeader.vue')['default']
20+
TheSidebar: typeof import('./src/components/TheSidebar.vue')['default']
21+
}
22+
}
23+
24+
export { }

‎examples/vuejs/index.html

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<link rel="icon" href="/favicon.ico" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<title>Use Python Vue example</title>
8+
</head>
9+
<body>
10+
<div id="app"></div>
11+
<script type="module" src="/src/main.ts"></script>
12+
</body>
13+
</html>

‎examples/vuejs/package.json

+36
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
{
2+
"name": "usepython_example",
3+
"version": "0.0.1",
4+
"private": true,
5+
"scripts": {
6+
"dev": "vite",
7+
"build": "vite build",
8+
"preview": "vite preview"
9+
},
10+
"dependencies": {
11+
"@nanostores/vue": "^0.6.0",
12+
"highlight.js": "^11.4.0",
13+
"simple-code-editor": "^1.2.2",
14+
"usepython": "0.0.3",
15+
"vue": "^3.2.31"
16+
},
17+
"devDependencies": {
18+
"@iconify/json": "^2.1.26",
19+
"@snowind/plugin": "0.4.0",
20+
"@tailwindcss/forms": "^0.5.0",
21+
"@vitejs/plugin-vue": "^2.3.1",
22+
"@vue/compiler-sfc": "^3.2.31",
23+
"autoprefixer": "^10.4.4",
24+
"path": "^0.12.7",
25+
"postcss": "^8.4.12",
26+
"rollup-plugin-typescript2": "^0.31.2",
27+
"sass": "^1.50.0",
28+
"tailwindcss": "^3.0.23",
29+
"tailwindcss-semantic-colors": "^0.2.0",
30+
"tslib": "^2.3.1",
31+
"typescript": "^4.6.3",
32+
"unplugin-icons": "^0.14.1",
33+
"unplugin-vue-components": "^0.18.5",
34+
"vite": "^2.9.1"
35+
}
36+
}

‎examples/vuejs/postcss.config.js

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
module.exports = {
2+
plugins: [
3+
require('tailwindcss'),
4+
require('autoprefixer'),
5+
]
6+
}

‎examples/vuejs/public/favicon.ico

1.12 KB
Binary file not shown.

0 commit comments

Comments
 (0)