快速上手
安装
sh
pip install org.vuepy.core
创建一个 Vue.py 应用
前提条件
- 熟悉命令行
- 已安装 Vue.py
在本节中,我们将介绍如何在本地搭建 Vue.py 单页应用, 并允许我们使用 Vue.py 的单文件组件 (SFC)。
确保你安装了最新版本的 Vue.py,并且你的当前工作目录正是打算创建项目的目录。在命令行中运行以下命令 (不要带上 $
符号):
Vue.py
sh
$ python -m vuepy create
这一指令将会安装并执行项目脚手架工具。你将会看到一些诸如 项目名称之类的提示:
✔ Project name: … <your-project-name>
Scaffolding project in ./<your-project-name>...
Done.
如果不确定是否要开启某个功能,你可以直接按下回车键选择 No
。在项目被创建后,生成如下目录结构:
ipywui
: Vue.py自带的组件库文件(Vue.py组件文件,方便开发时进行自动补全,仅在开发时依赖)。App.vue
: 单页应用文件的单文件组件。app.py
: 单页应用文件的setup文件。app.ipynb
: 加载单页应用的 Jupyter Notebook 文件。
tree
sh
<your-project-name>
├── App.vue
├── app.py
├── app.ipynb
└── ipywui
运行 Vue.py 应用
前提条件
- 已创建 Vue.py 应用
- 已安装 JupyterLab
可以在 JupyterLab 中通过运行app.ipynb
加载应用,也可以在已有的 notebook
中通过以下方法运行应用:
import_sfc
函数从文件
加载组件,再使用create_app
创建应用并运行。%vuepy_import
魔法方法从文件
加载组件,再使用create_app
创建应用并运行。%vuepy_run
直接从文件
创建应用并运行。%%vuepy_run
从源码字符串
创建应用并运行。
import_sfc
%vuepy_import
%vuepy_run
%%vuepy_run
python
from pathlib import Path
from vuepy import create_app, import_sfc
# 根据 App.vue 实际位置修改
App= import_sfc(Path() / 'App.vue')
app = create_app(App)
app.mount()
你现在应该已经运行起来了你的第一个 Vue.py 项目!下面是一些补充提示:
- 推荐的 IDE 配置是 Visual Studio Code + Vue - Official 扩展。
- 另一个推荐的 IDE 配置是 PyCharm + Vue 插件。如果使用其他编辑器,参考 IDE 支持章节。
下一步
如果你尚未阅读简介,我们强烈推荐你在移步到后续文档之前返回去阅读一下。