上一节安装了flask，我们现在需要安装vue前端框架，需要使用vue-cli方便安装和管理。
安装vue-cli
先要全局安装vue-cli，可以使用下列任一命令安装这个新的包：
npm install -g @vue/cli
# OR
yarn global add @vue/cli
你还可以用这个命令来检查其版本是否正确 (3.x)：
vue --version
如果你已经全局安装了旧版本的 vue-cli (1.x 或 2.x)，你需要先通过 npm uninstall vue-cli -g 或 yarn global remove vue-cli 卸载它。
使用图形化界面
官方文档
已经安装最新版本的vue-cli，我很推荐这个图形化界面，非常方便。
你也可以通过 vue ui 命令以图形化界面创建和管理项目：
vue ui
官网的图
图形化的界面就不需要多介绍了，有中文都能很好地使用。
新建vue项目
需要合并flask使用，所以需要将vue项目创建在flask项目根目录。
使用Vue项目管理器，选择项目地址flask-vue根目录（上节运行flask示例的文件夹），创建新项目名称vue。根据具体需求选择创建条件完成项目创建，自动跳转至项目详情页。
运行编译环境
项目详情页中，按下图点击，可运行编译和热更新，此时你就可以开始码前端代码了，Vue的编写这里就不过多介绍：
运行编译和热更新
点击右上角这个启动app按钮，自动打开新窗口，可以看到你之前创建的vue前端页面了。
TIM截图20181220114456.png
下一节Flask与Vue的关联。
网友评论