使用Python+Django+drf+vue搭建测试平台---4搭建vue前端项目

使用Python+Django+drf+vue搭建测试平台—4搭建vue前端项目

1.搭建vue前准备工作
2.安装vue
3.安装Visual Studio Code
4.创建vue项目

搭建vue前准备工作

1、下载地址为:https://nodejs.org/en/
2、检查node是否安装成功
在这里插入图片描述
3.安装 cnpm

npm install -g cnpm –registry=https://registry.npm.taobao.org

检查node是否安装成功
在这里插入图片描述
安装vue
全局安装vue-cli

npm install --global vue-cli

创建vue项目
进入你存放项目目录,创建一个基于 webpack 模板的新项目:

vue init webpack 项目名称

安装Visual Studio Code
下载VSCode安装包,官网传送门https://code.visualstudio.com/
网上有许多教程,自行安装
通过VS Code 打开vue项目

npm run dev

使用Python+Django+drf+vue搭建测试平台---4搭建vue前端项目_第1张图片
使用Python+Django+drf+vue搭建测试平台---4搭建vue前端项目_第2张图片

就此 vue项目运行成功
俗话说的好:前人栽树,后人乘凉,在网上有好多优秀的开源框架模板,秉承不重复造轮子的理念,请参照https://github.com/PanJiaChen/vue-admin-template开源模板搭建框架进行开发。

# 克隆项目
git clone https://github.com/PanJiaChen/vue-admin-template.git

# 进入项目目录
cd vue-admin-template

# 安装依赖
npm install

# 建议不要直接使用 cnpm 安装以来,会有各种诡异的 bug。可以通过如下操作解决 npm 下载速度慢的问题
npm install --registry=https://registry.npm.taobao.org

# 启动服务
npm run dev

这样前端项目就运行起来了,然后再针对自己的需求进行修改。
感谢作者-----https://github.com/PanJiaChen

你可能感兴趣的:(测试平台搭建,vue,python,django)