1.下载二进制包 https://nodejs.org/zh-cn/
直接下一步下一步即可,然后dmd中如下显示说明成功:
C:\Program Files\nodejs>node -v
v12.18.1
https://github.com/PanJiaChen/vue-element-admin ---这是github上vue完整项目模版,它的在线预览如下图:
2.widows安装git
https://www.git-scm.com/download/win --下载
http://www.mamicode.com/info-detail-2736524.html ---安装
效果如下:
3.新建前端代码目录web和我的devops项目后端代码目录同级:
4.把vue模版克隆下来:
5.安装nodejs
https://developer.aliyun.com/mirror/NPM?from=tnpm
注意安装过程中出现war正常,出现error就不行。
安装完后,此时它就生成F:\devops\data\web\vue-admin-template\node_modules目录(里边是依赖包),若安装时出错就直接把此目录删除再重新装
6.运行服务
点击登录后,模版环境就出来了如下图:
7.起后端项目服务
[vagrant@CentOS ~]$ source python36env/bin/activate
(python36env) [vagrant@CentOS ~]$ cd /vagrant/
(python36env) [vagrant@CentOS vagrant]$ cd devops/
(python36env) [vagrant@CentOS devops]$ ls
apps devops manage.py scripts
(python36env) [vagrant@CentOS devops]$ python manage.py runserver 0.0.0.0:8000
访问后端接口:http://127.0.0.1:8000/
8.因为我的后端项目中我之前做了权限,所以这里我把所有api的权限取消
9.打开pycharm修改为允许垮域访问settings.py:
(1)安装:打开github搜索django cors header --->https://github.com/adamchainz/django-cors-headers对照此
(python36env) [vagrant@CentOS devops]$ pip install django-cors-headers 不做此步的话无法通过命令来通过ajax(异步请求)请求数据
(2)配置settings.py:
(3)middleware配置中注意先后顺序:放在commonmiddleware上---添加中间件监听
(4)配置允许跨域的域名:这里设成*,允许所有域名跨域请求我数据,如果是线上环境的话,你允许哪个域名请求,这里就写哪个域名即可
(python36env) [vagrant@CentOS devops]$ python manage.py runserver 0.0.0.0:8000 起动服务
10.配置前端代码用webstorm/notepa++/vscode等均可
11
22