阿里云服务器下Ubuntu通过Nginx 运行Vue项目

服务器部分请参照这篇文章：服务器部分

🚀🚀 Step 0: 安装FinalShell工具(本地)

• 不熟悉ubuntu/linux的操作命令,用这个工具代替了,大神请无视
• 下载链接: finalshell
• 名称：随意， 主机: 服务器Ip, 端口-22
  
  登录成功后，就可以像操作windows一样操作文件了

🚀🚀 Step 1: 创建文件夹(服务器端)

• 连接到服务器(通过ssh或者登录阿里云服务器直接远程连接)
• 创建目录 mkdir vue-app-base

🚀🚀 Step 2: 上传打包好的文件(本地)

• 在项目根目录执行 npm run build 进行打包,然后生成 dist目录
• 切换到项目打包后的dist目录
• scp -r dist root@47.114.105.120:/root/vue-app-base
• -r命令是文件夹目录，把当前/dist目录下所有文件上传到服务器的/vue-app-base目录中

🚀🚀 Step 3: 安装nginx(服务器端)

• sudo apt-get install nginx
• nginx -v 查看是否安装成功
  

🚀🚀 Step 4: 修改nginx配置文件

# user www-data;
# 🌈 防止权限,将这里改为 root
user root;
worker_processes auto;
pid /run/nginx.pid;
include /etc/nginx/modules-enabled/*.conf;

events {
	worker_connections 768;
	# multi_accept on;
}

http {

	##
	# Basic Settings
	##

	sendfile on;
	tcp_nopush on;
	tcp_nodelay on;
	keepalive_timeout 65;
	types_hash_max_size 2048;
	# server_tokens off;

	# server_names_hash_bucket_size 64;
	# server_name_in_redirect off;

	include /etc/nginx/mime.types;
	default_type application/octet-stream;

	##
	# SSL Settings
	##
	ssl_protocols TLSv1 TLSv1.1 TLSv1.2 TLSv1.3; # Dropping SSLv3, ref: POODLE
	ssl_prefer_server_ciphers on;

	##
	# Logging Settings
	##

	access_log /var/log/nginx/access.log;
	error_log /var/log/nginx/error.log;

	##
	# Gzip Settings
	##

	gzip on;

	server {
           # 🌈 端口号
	   listen       3309; 
           # 🌈 IP
        server_name  47.114.105.120;

        location / {
            # 🌈 执行目录
            root   /root/vue-app-base/dist/;
            index index.html;
            # index  index.html index.htm;
            # try_files  $uri $uri/ /index.html;
        }
	}

	# gzip_vary on;
	# gzip_proxied any;
	# gzip_comp_level 6;
	# gzip_buffers 16 8k;
	# gzip_http_version 1.1;
	# gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript;

	##
	# Virtual Host Configs
	##

	include /etc/nginx/conf.d/*.conf;
	include /etc/nginx/sites-enabled/*;
}


#mail {
#	# See sample authentication script at:
#	# http://wiki.nginx.org/ImapAuthenticateWithApachePhpScript
# 
#	# auth_http localhost/auth.php;
#	# pop3_capabilities "TOP" "USER";
#	# imap_capabilities "IMAP4rev1" "UIDPLUS";
# 
#	server {
#		listen     localhost:110;
#		protocol   pop3;
#		proxy      on;
#	}
# 
#	server {
#		listen     localhost:143;
#		protocol   imap;
#		proxy      on;
#	}
#

💛 nginx 命令

# 启动Nginx服务
sudo /etc/init.d/nginx start

# 停止Nginx服务
sudo /etc/init.d/nginx quit

# 加载最新配置
sudo /etc/init.d/nginx reload

# 立即停止Nginx服务
sudo /etc/init.d/nginx stop

# 查看 nginx 错误日志
cat /var/log/nginx/error.log