npm_Pyodide__1">npm 方式安装Pyodide 详解

---

npm__Pyodide_7">如何通过 npm 安装 Pyodide

Pyodide_9">1. 安装 Pyodide

在您的项目中运行以下命令：

npm install pyodide

这将安装 Pyodide npm 包。

---

Pyodide_21">2. 在项目中使用 Pyodide

以下是如何在 JavaScript 或 TypeScript 项目中使用 npm 安装的 Pyodide：

使用 JavaScript

import { loadPyodide } from "pyodide";async function initPyodide() {// 加载 Pyodide 环境const pyodide = await loadPyodide();// 运行 Python 代码const result = pyodide.runPython(\`import mathmath.sqrt(16)\`);console.log("Python Result:", result); // 输出 4.0
}initPyodide();

使用 TypeScript

import { loadPyodide, PyodideInterface } from "pyodide";async function initPyodide(): Promise<void> {// 加载 Pyodide 环境const pyodide: PyodideInterface = await loadPyodide();// 运行 Python 代码const result = pyodide.runPython(\`import mathmath.sqrt(16)\`);console.log("Python Result:", result); // 输出 4.0
}initPyodide();

---

3. 加载第三方库

Pyodide npm 包支持通过 loadPackage 动态加载库。例如加载 NumPy：

import { loadPyodide } from "pyodide";async function loadLibraries() {const pyodide = await loadPyodide();await pyodide.loadPackage("numpy");const result = pyodide.runPython(\`import numpy as npnp.array([1, 2, 3]) * 2\`);console.log("NumPy Result:", result); // 输出 [2, 4, 6]
}loadLibraries();

---

4. 与 JavaScript 交互

通过 npm 安装的 Pyodide，您可以像使用 CDN 一样实现 Python 和 JavaScript 的双向交互。

从 JavaScript 向 Python 传递数据

pyodide.globals.set("js_list", [10, 20, 30]);
pyodide.runPython(\`python_list = js_list + [40, 50]print(python_list)
\`);

从 Python 返回数据给 JavaScript

const result = pyodide.runPython(\`[1, 2, 3, 4, 5]
\`);
console.log(result); // 输出 [1, 2, 3, 4, 5]

---

5. 适合的场景

通过 npm 安装的 Pyodide 更适合以下场景：

1. 前端项目： 在 React、Vue、Angular 等框架中集成 Pyodide，增强功能。
2. 模块化开发： npm 包形式更适合现代 JavaScript 工程化需求。
3. TypeScript 支持： Pyodide npm 包包含类型定义文件，便于在 TypeScript 中使用。

---

6. 总结

通过 npm 安装 Pyodide 的优势：

• 更易于集成到现代前端项目中。
• 支持模块化开发，避免使用全局变量。
• 提供良好的 TypeScript 支持。

如果您使用的是现代化的前端开发工具（如 Webpack、Vite），推荐使用 npm 安装的方式管理 Pyodide 依赖。