vue项目打包部署linux_vue项目打包-上传-部署到linux的nginx服务器上

vue项目打包

https://www.cnblogs.com/hi-shepherd/p/6911098.html

npm run build

其中 要改assetsPublicPath: ‘./’ 否则不能正确载入静态文件

build: {

// Template for index.html

index: path.resolve(__dirname, '../dist/index.html'),

// Paths

assetsRoot: path.resolve(__dirname, '../dist'),

assetsSubDirectory: 'static',

assetsPublicPath: './',

/**

实验了下

改为./ 指当前路径 打开控制台的source里看 src=./static/js/vendor.9cfa2099ad16983df003.js

/ 指根路径 打开控制台的source里看 src=/static/js/vendor.9cfa2099ad16983df003.js 就找不到了

上传

compress成zip

传到服务器上 再 unzip就行了

linux下安装nginx(一种类似于tomcat的服务器 把你的项目部署上去 和webpack使用dev server没有优化)

安装：第一步到第九步 https://www.cnblogs.com/lori/p/6807080.html

查看版本号 检查是否安装成功

/usr/local/nginx/sbin/nginx -v

nginx version: nginx/1.10.1

修改配置：# vim /usr/local/nginx/conf/nginx.conf

我修改为8099端口

server {

listen 8099;

server_name localhost; //其实最好改成你的ip 不要写域名 localhost在这台server上相当于是10.xxx xxx的意思

#charset koi8-r;

#access_log logs/host.access.log main;

location / {

root /root/data; //把dist.zip解压到data文件夹下

index index.html index.htm;

}

##重新再入配置并启动

/usr/local/nginx/sbin/nginx -s reload # 重新载入配置文件

/usr/local/nginx/sbin/nginx -s reopen # 重启 Nginx

/usr/local/nginx/sbin/nginx -s stop # 停止 Nginx

这样打开 http://10.xxxxxxxx:8099/#/ 就能看到自己的项目了

2018.10.19更新

我又搭环境的时候，遇到新问题

本地无法访问vm的nginx

iptables关闭 ／ 加一行，让8088能被访问

访问页面但是报403 forbidden

可能是nginx.conf里的root配置的文件夹 权限不够 chmod -R 755 /root

nginx 1.12的config是这样的

server {

listen 8088;

listen [::]:80 default_server;

server_name 10.234.28.168;

# root /usr/share/nginx/html;

root /root/frontend;

# Load configuration files for the default server block.

include /etc/nginx/default.d/*.conf;

location / {

# root /root/frontend;

index index.html index.htm;

}

但是为啥访问localhost不行捏 ？那是你没搞懂域名 和 ip的关系

https://blog.csdn.net/benben_2015/article/details/79249918

https://www.oschina.net/question/348008_160768