1、首先在宝塔的软件商店中安装Nginx
打开首页显示
2、在Vue
的项目中新建终端执行:npm run build
得到dist
文件夹
3、上传dist
文件到宝塔的/www/server/nginx/html
路径下:
4、配置Nginx
,打开Nginx
管理—配置修改:
server
{
listen 80;
server_name mayibang.co *.mayibang.co;
index index.php index.html index.htm default.php default.htm default.html;
root /www/wwwroot/mayibang.co/public;
#SSL-START SSL相关配置,请勿删除或修改下一行带注释的404规则
#error_page 404/404.html;
#SSL-END
#ERROR-PAGE-START 错误页配置,可以注释、删除或修改
error_page 404 /404.html;
error_page 502 /502.html;
#ERROR-PAGE-END
#PHP-INFO-START PHP引用配置,可以注释或修改
include enable-php-72.conf;
#PHP-INFO-END
#REWRITE-START URL重写规则引用,修改后将导致面板设置的伪静态规则失效
include /www/server/panel/vhost/rewrite/mayibang.co.conf;
#REWRITE-END
#禁止访问的文件或目录
location ~ ^/(\.user.ini|\.htaccess|\.git|\.svn|\.project|LICENSE|README.md)
{
return 404;
}
location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$
{
expires 30d;
access_log off;
}
location ~ .*\.(js|css)?$
{
expires 12h;
access_log off;
}
access_log /www/wwwlogs/mayibang.co.log;
}
修改server
的root
为 /www/server/nginx/html/dist
5、重载配置并且重启Nginx
服务
打开网页: