Ubuntu 配置 django 和 vue的环境

1.安装名为'Django'的python模块
'''

sudo pip install django

'''
2.安装名为'sass_processor' 的Python模块，'sass_processor' 是一个Django应用程序，它用于处理SASS和SCSS样式表
'''

sudo pip install django-sass-processor

'''
3.安装名为 'widget_tweaks' 的Python模块，'widget_tweaks' 库提供了一些实用工具，用于扩展Django表单小部件的功能(网络问题会出现报错)
'''
 

$ sudo pip install django-widget-tweaksv

在终端中执行以下命令，安装Nginx：
 

$ sudo apt-get update
$ sudo apt-get install nginx

1.安装

$ sudo apt install nodejs
$ sudo apt install npm

2.安装nvm管理器来升级nodejs
 

$ curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.38.0/install.sh | bash
$ echo 'export NVM_DIR="$HOME/.nvm"' >> ~/.bashrc
$ echo '[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"' >> ~/.bashrc
$ source ~/.bashrc
$ nvm install stable
$ nvm use stable
$ sudo npm install -g @vue/cli

运行django
'''

$ /bin/python3 /home/yqp/django-cuba/manage.py migrate
$ /bin/python3 /home/yqp/django-cuba/manage.py runserver

'''
运行vue
 

$ npm run dev

完整方法：

下载对应依赖

# django
conda install django
# sass_processor
pip install django-sass-processor
# widget_tweaks
conda install -c conda-forge django-widget-tweaks
# nodejs
conda install -c conda-forge nodejs
# npm
# 上面这句一起装了，可以输入 npm -v 查看
# update nodejs
# 先用下面这句查看 nodejs 在 conda 中可升级到的最高版本,找到的是18.15.0
conda search nodejs --channel conda-forge
# 然后执行安装对应版本
conda install -c conda-forge nodejs=18.15.0
# @vue/cli
npm install -g @vue/cli
# Nginx
sudo apt update
sudo apt install nginx

# 补充依赖
pip install django-cors-headers
pip install djangorestframework
pip install mysqlclient
# conda install pymysql

安装mysql服务器

sudo apt install mysql-client
sudo apt install mysql-server

sudo service mysql status

 

mysql.server start

mysql -u root -p

在mysql里面创建名为 web_db 的数据库

CREATE DATABASE web_db CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;
SHOW DATABASES;

django.db.utils.OperationalError: (2002, "Can't connect to local MySQL server through socket '/tmp/mysql.sock' (2)")

• 230407 : django.db.utils.OperationalError: (2002, "Can't connect to local MySQL server through socket '/tmp/mysql.sock' (2)")

  解决方法：
  在 settings.py 中，DATABASES 部分改为如下
  DATABASES = {
      'default': {
          'ENGINE': 'django.db.backends.mysql',
          'NAME': 'web_db', #en 数据库名称
          'USER': 'root', # 数据库用户名
          'PASSWORD': '123', # 数据库密码（自己电脑的密码）
          'HOST': 'localhost', # 数据库主机名
          'PORT': '3306', # 数据库端口
          'OPTIONS': {
              'unix_socket': '/var/run/mysqld/mysqld.sock', # 替换为实际的套接字文件路径
          },
      }       
  }
  

需要修改的配置

---

• 本地运行的情况下

  • vue

    path.js 文件

    # 这个 Url 需要改为 127.0.0.1:8000
    baseUrl:"<http://127.0.0.1:8000>",
    

  • django

    不需要修改

• 阿里云服务器运行的情况下

  • vue

    path.js 文件

    # 这个 Url 需要改为阿里云的 ip 和端口
    baseUrl:"<http://x.x.x.x>:yyyy",
    

  • django

    settings.py 需要修改的地方

    # 192.168.3.12 要改为阿里云服务器的 ip 
    ALLOWED_HOSTS = ['192.168.3.12','127.0.0.1']
    

运行测试

---

后端初始化

---

第一次运行前需要执行下列命令，之后启动都不需要了

cd ~/workspace/rubber-management-system/django/myproject
# conda 环境下的命令
sudo ~/anaconda3/envs/web/bin/python3 manage.py migrate
# 非 conda 环境下的命令
sudo /bin/python3 manage.py migrate

后端运行

---

cd ~/workspace/rubber-management-system/django/myproject
# conda 环境下的命令
sudo ~/anaconda3/envs/web/bin/python3 manage.py runserver
# 非 conda 环境下的命令
sudo /bin/python3 manage.py runserver

前端运行

---

cd ~/workspace/rubber-management-system/vue/rubber
npm run dev