vue项目部署到Ubuntu下apache2

开发软件:HbuilderX
用finallshell操作Ubuntu下apache2

一、vue项目文件配置与打包

1、修改config文件夹下index.js文件
vue项目部署到Ubuntu下apache2_第1张图片
vue项目部署到Ubuntu下apache2_第2张图片

 "/api": {
              "target": "http://140.143.242.103", //finallshell服务器的ip地址
              "changeOrigin": true,
      }

2、在HbuilderX终端上运行npm run build打包构建,运行完成后会多一个dist文件夹,文件夹下的内容即要上传到服务器的内容。

vue项目部署到Ubuntu下apache2_第3张图片

二、代码部署到Ubuntu下apache2

前台代码放在/var/www/html文件下
1、打开finallshell连接服务器,进入/var/www/html,将本地dist文件夹下static文件和index.html文件拖动上传到该目录下。
vue项目部署到Ubuntu下apache2_第4张图片
2、添加.htaccess文件
vue项目部署到Ubuntu下apache2_第5张图片
双击打开文件,文件中添加如下代码,添加后Ctrl+S保存


  RewriteEngine On
  RewriteBase /
  RewriteRule ^index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteRule . /index.html [L]

3、修改/etc/apache2下apache2.conf文件,将AllowOverride None改为AllowOverride All

vue项目部署到Ubuntu下apache2_第6张图片
4、重启apache2即可,重启命令如下:

# /etc/init.d/apache2 restart

Linux系统为Ubuntu

一、Start Apache 2 Server /启动apache服务
#/etc/init.d/apache2 start
or
$ sudo /etc/init.d/apache2 start
二、 Restart Apache 2 Server /重启apache服务
#/etc/init.d/apache2 restart
or
$ sudo /etc/init.d/apache2 restart
三、Stop Apache 2 Server /停止apache服务
/etc/init.d/apache2 stop
or
$ sudo /etc/init.d/apache2 stop

你可能感兴趣的:(网站搭建,vue)