简介
最近想搭一个基于Djaogo+Vue的网站,centos作为服务器,个人pc作为前端设计使用。
centos7软件版本:
python系统自带2.7版本,也可以下载3.6版本,注意尽量使用这两个版本
django: 1.11.7
node: 8.5.0
按照下面步骤一般可以一路畅行,搞这个环境太痛苦了各种报错,如果要安装最新版本,注意需要查阅一下版本中一些配置文件中的写法,会有一些细微差别导致无法运行之类的。
实战
1.安装依赖+更新,为了避免各种环境报错建议执行下面命令来更新系统和安装相关软件的依赖环境。(建议使用管理员登录执行)
#yum源变更为国内163安装源
cd /etc/yum.repos.d
mv CentOS-Base.repo CentOS-Base.repo.backup
wget http://mirrors.163.com/.help/CentOS6-Base-163.repo
mv CentOS6-Base-163.repo CentOS-Base.repo
yum clean all
#安装依赖
yum update -y
yum -y groupinstall "Development tools"
yum install openssl-devel bzip2-devel expat-devel gdbm-devel readline-devel sqlite-devel psmisc libffi-devel python-pip python-devel epel-release
yum install -y zlib zlib-dev openssl-devel sqlite-devel bzip2-devel libffi libffi-devel gcc gcc-c++
#更新密钥
rpm --import /etc/pki/rpm-gpg/RPM-GPG-KEY-CentOS-7
2.安装node环境
wget https://nodejs.org/dist/v8.5.0/node-v8.5.0-linux-x64.tar.gz
tar zxvf node-v8.5.0-linux-x64.tar.gz
#配置变量环境注意解压路径
export NODE_HOME="/root/node-v8.5.0-linux-x64"export PATH=$PATH:$NODE_HOME/bin
source /etc/profile
#查看是否安装成功
node -v
npm -v
3.安装Django
pip install Django==1.11.7
# 查看django版本
python -m django --version
4.安装vue-cli
npm install -g cnpm --registry=https://registry.npm.taobao.org
cnpm install -g vue-cli
npm install webpack -g
5.Djaogo新建一个项目
#注意taibai就是项目名称也是www根目录名字
django-admin startproject taibai
6.配置settings.py也就就是配置文件
#djaogo建立项目后会有两层,第一个是根、第二个是全局配置文件
vi taibai/taibai/settings.py
#修改全ip访问,可以使用固定ip
ALLOWED_HOSTS = [] 修改为 ALLOWED_HOSTS = [‘*’]
7.关闭防火墙
systemctl stop firewalld
systemctl disable firewalld
systemctl is-enabled firewalld
改/etc/selinux/config文件中设置SELINUX=disabled
8.运行验证
#查看自己的IP地址
ifconfig
#根目录下运行,0.0.0.0是IP 80是端口
python manage.py runserver 0.0.0.0:80
#想要停止项目按住ctrl+c
(其他电脑访问显示下面页面代表成功)
9.新建vue前端项目
#进入根目录,taibai_vue是项目名
vue-init webpack taibai_vue
#打包
npm install
#运行
npm run build
10.配置vue页面为项目前端
#修改配置文件,找到TEMPLATES配置项,修改如下:
vi taibai/taibai/settings.py
#修改 'DIRS':['taibai_vue/dist']
TEMPLATES = [
{
'BACKEND': 'django.template.backends.django.DjangoTemplates',
# 'DIRS': [],
'DIRS':['taibai_vue/dist'],
'APP_DIRS': True,
'OPTIONS': {
'context_processors': [
'django.template.context_processors.debug',
'django.template.context_processors.request',
'django.contrib.auth.context_processors.auth',
'django.contrib.messages.context_processors.messages',
],
},
},
]
# 最下面添加
STATICFILES_DIRS = [
os.path.join(BASE_DIR, "taibai_vue/dist/static"),
]
11.配置路由让前端显示为vue页面
#修改路由文件
vi taibai/taibai/urls.py
#添加下面内容
from django.contrib import admin
from django.urls import path
from django.views.generic.base import TemplateView
urlpatterns = [
# path('admin/', admin.site.urls),
path('admin/', admin.site.urls),
path(r'', TemplateView.as_view(template_name="index.html")),
]
12.运行验证
python manage.py runserver 0.0.0.0:80
(显示下面页面则成功)