如今vue-cli已是前端工程師必會的框架了(沒有之一),不少前端工程師只會Vue項目的開發,並不會部署,由於大部分公司項目的部署工做是交給本身的上級或者項目管理者的,關於部署的相關知識可能你們都不甚瞭解,今天就給你們深刻講解一下我對Vue項目部署的心得和體會!html
1.Vue項目打包前端
vue項目的打包可能你們都不陌生,一句npm run build就完事了,打包完成後項目會生成一個「dist」文件夾,裏面是打包好的「靜態文件」。那關於「靜態文件」你們可能都不陌生,前端以前的項目都是由靜態文件構成的,雖然如今前端的項目工程化了,可是;所謂「萬變不離其宗」,它的原本面目仍是靜態文件而已!vue
2.準備靜態服務器nginx
咱們上文說到Vue打包完成後是靜態文件,所以咱們部署Vue項目只須要準備一個靜態服務器便可,與PHP項目的部署無異。可是有些工程師學過一些Node.js自覺得很高深,把項目部署在Node靜態服務文件夾下......而後啓動Node服務器以帶動Vue項目。你們說這種方法如何?我只能說這樣的項目只是一個「玩具」,由於Node自己就不夠強大和穩定,更況且它的靜態服務呢?vue-cli
3.nginx部署npm
本文爲你們推薦的是用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項目部署的一些知識,若是還不明白能夠在博客下面留言前端工程師