服务器指定端口部署vue项目(webpack打包后的文件)
前言:之前部署项目一直都是往服务器上面一扔,就直接可以访问了,但是向指定的端口部署项目这个貌似还不一样╮( ̄▽ ̄")╭目录:一.项目打包:二.修改nginx配置文件:三.nginx的操作:一.项目打包:配合webpack工具对VUE项目进行打包,我们可以在package.json文件下修改好build的命令,或者在文件目录下打开终端使用npm run build命令对项目进行打包。打包成功后会生成
·
前言:之前部署项目一直都是往服务器上面一扔,就直接可以访问了,但是向指定的端口部署项目这个貌似还不一样╮( ̄▽ ̄")╭
一.项目打包:
配合webpack工具对VUE项目进行打包,我们可以在package.json
文件下修改好build的命令,或者在文件目录下打开终端使用npm run build
命令对项目进行打包。
打包成功后会生成dist
文件,这个就是我们必需的文件。
二.修改nginx配置文件:
一般的nginx的配置文件会在/etc/nginx/conf.b
目录下或者在/etc/nginx/sites-enabled
目录下,当然这要根据当时安装的目录来说,在目录下我们找到配置文件,目前我的配置文件名为default
,我们使用cp -r 目标文件名 原来的文件名(default)
来进行复制一个文件避免修改出问题了。
具体的配置如下:
server{
listen 端口号 default_server;
listen [::]:端口号 default_server;
root 项目目录;
index index.html index.htm;
server_name _;
#可以加上404触发的页面,目前俺没有加
}
三.nginx的操作:
当然这些修改完只是将项目指定端口存放,我们还需要使用命令nginx -s reload
来对nginx
服务进行重启,如果重启后不报错那么就重启成功了,否则根据报错信息进行修改。
nginx -s reload
注意:这个端口是已经进行开放的,如果没有进行端口的开放是无法生效的哦!
更多推荐
已为社区贡献7条内容
所有评论(0)