Vue项目的部署简述

现在vue-cli已经是前端工程师必会的框架了（没有之一），很多前端工程师只会Vue项目的开发，并不会部署，因为大部分公司项目的部署工作是交给自己的上级或者项目管理者的，关于部署的相关知识可能大家都不甚了解，今天就给大家深入讲解一下我对Vue项目部署的心得和体会！

1.Vue项目打包

vue项目的打包可能大家都不陌生，一句npm run build就完事了，打包完成后项目会生成一个“dist”文件夹，里面是打包好的“静态文件”。那关于“静态文件”大家可能都不陌生，前端之前的项目都是由静态文件构成的，虽然现在前端的项目工程化了，但是；所谓“万变不离其宗”，它的本来面目还是静态文件而已！

2.准备静态服务器

我们上文说到Vue打包完成后是静态文件，因此我们部署Vue项目只需要准备一个静态服务器即可，与PHP项目的部署无异。但是有些工程师学过一些Node.js自以为很高深，把项目部署在Node静态服务文件夹下......然后启动Node服务器以带动Vue项目。大家说这种方法如何？我只能说这样的项目只是一个“玩具”，因为Node本身就不够强大和稳定，更何况它的静态服务呢？

3.nginx部署

本文为大家推荐的是用nginx部署Vue项目，nginx能做的事情太多了，我们常用的有：正向代理、反向代理、负载均衡等，它的知识你想学三天三夜都学不完，之前在图书馆看到nginx的教程有那么厚，而我们用不到那么多，只需要学会用nginx部署我们的Vue项目就可以了，以下是最简单的nginx配置：

http {    
    include       mime.types;  
    default_type  application/octet-stream;  
    sendfile        on;
   
    server {
   
       listen 80;  #端口             
       server_name localhost; #可换成你的域名    
       root /var/www/vue/; #项目目录   
       index index.html;
   
       } }

好了，以上就是Vue项目部署的一些知识，如果还不明白可以在博客下面留言