vue項目部署到伺服器

1、webpack打包後的代碼，如何部署到伺服器上

本文章前端代碼是基於vue+webpack開發的

Nginx是一款輕量級的Web 伺服器/反向代理伺服器

首先，webpack配置如下

在開發過程中，我們是通過npm run dev在開發環境中運行代碼
如果要部署到生產環境中，可以運行npm run build進行上線打包

打包完成後，會發現項目中多了dist這個文件夾

執行結果和webpack的配置文件一致。

代碼被webpack打包完成後下一步就是部署到伺服器上，此文僅適合於前端代碼是部署在windows操作系統的nginx服務中。
這里假設：
Windows操作系統：windows server 2008 64位
Nginx服務：nginx-1.12.2 64位

1.下載nginx-1.12.2 64位解壓，假設nginx-1.12.2放在D:nginx-1.12.2目錄中，nginx目錄結構。如圖下

2、前端代碼放在D:nginx-1.12.2html目錄中，dist目錄就是剛剛前端打包完的代碼。如圖下

3、在D:nginx-1.12.2conf目錄中，有個nginx.conf配置文件，進行編輯這個文件

4、假設前端的埠號為8082，如果埠號被佔用，請修改為其它埠號。後台服務訪問地址http://192.168.121.**:8080,

5、打開cmd控制台，進入目錄D:nginx-1.12.2中，用start nginx命令啟動服務，然後用tasklist /fi "imagename eq nginx.exe"，查看nginx服務是否啟動。

4、如果改變配置文件時，需要用nginx -s reload 命令重啟nginx工作進程。

5、關閉服務
nginx -s stop 
nginx -s quit 安全關閉 
taskkill /F /IM nginx.exe > nul 關閉所有nginx服務

2、vue 項目部署伺服器上json404？

第一:確定下ICP備案後的地址，及網路、域名等，
第二:確定你的網路介面可用，
第三:重新發布小程序代碼。

3、vue如何將項目部署到伺服器上並且使外網能夠訪問到

你的伺服器是什麼系統啊 ，，，linux LINUX、WINDOWS、NETWARE、UNIX。。

在linux

首先伺服器安裝node git nginxvue-cli

安裝好nginx 用你的公網ip訪問就可以看到 下面的頁面

然後進入到下面的路徑

vi default 你會看到nginx的默認配置

默認監聽80埠 根路徑

把你寫好的vue項目 上傳到github ，通過git clone 克隆到

伺服器

路徑下面

然後npm/yarn add/install 安裝依賴 然後npm run build

vi 打開html 下面的 index.html 可以看到

nginx默認的html

進入sites-enabled 發現 它裡面的 default 來自 sites-available的default

所以需要在 sites-available 新建一個文件 你的項目名命名就可以

在你新建的文件

我在site-available新建的文件是note-admin 映射到 sites-enables

注意路徑一定要寫全

最後重新載入下 nginx -s reload

打開瀏覽器 公網ip:埠號或者 域名訪問

這就可以了

還有 用express 部署這個 簡單些

4、vue發布到伺服器一個目錄下，路由怎麼配置

首先VUE 是一個javascript的前端框架，註定了它是運行在瀏覽器里的。
對伺服器本地沒有任何要求，只要一個靜態文件伺服器能通過http訪問到其資源文件。
無論你是用apache ,ngnix 就算你要用node 自己實現一個靜態文件伺服器，也用不了多少行代碼。

5、如何打包vue項目加node.js後端到雲伺服器

在命令行輸入npm run build:prod，等待打包完成

項目目錄下就會多出一個dist文件夾，裡面有index.html文件和static文件夾，
直接上傳到伺服器上就行了

6、Vue項目部署到Tomcat上面

你現在的這個情況是通過vue打包後，build之後的產物。

先不多說，直接說方法，最後再解釋。

想運行在tomcat上，先在打包之前做一下配置：

首先在config文件夾下找到index.js修改一下當前路徑

把assetsPublicPath：『/』改成assetsPublicPath：『./『

對就是/前面加個點兒。

然後重新打包。就可以直接打開了。

======================================

為什麼這樣做呢，因為vue的打包默認形成的是一個部署在伺服器環境上的文件，如果是部署在靜態站點上（express或者阿帕奇），就需要做路徑轉變。其實算是個小tip。

歡迎追問。

7、vue.js把原項目build下，放在伺服器上，如果以後要更新內容，怎麼更新啊，是在原項目文件更新在bulid下嗎

是，一般腳本都是直接刪除dist文件夾然後重新構建生成dist放到目標文件夾
你說的是伺服器有一套開發環境和代碼，然後在伺服器構建，不建議這樣做，畢竟很浪費伺服器空間，小東西可以這樣做。也可以直接把測試環境測試通過的代碼遷移到正式環境上

8、vuejs怎麼在伺服器部署

用vue-cli搭建的做法
1、npm run build
2、把dist里的文件打包上傳至伺服器 例 /data/www/，我一般把index.html放在static里
所以我的文件路徑為：

/data/www/static
|-----index.html
|-----js
|-----css
|-----images
....

3、配置nginx監聽80埠， location /static alias 到 /data/www/static，重啟nginx
location /static {
alias /data/www/static/;
}
4、瀏覽器訪問http://ip/static/index.html即可

9、vuejs怎麼在伺服器部署

既然是布署，哪默認就應該是生產環境下的布署，vue開發的應用本質上就是靜態文件,無論你用何種web伺服器，放上去就應該能通過http訪問

接下來我來幫大家來捋一捋

首先VUE 是一個javascript的前端框架，註定了它是運行在瀏覽器里的，對伺服器本地沒有任何要求，只要一個靜態文件伺服器能通過http訪問到其資源文件就足矣！無論你是用apache ,ngnix 就算你要用node 自己實現一個靜態文件伺服器，也用不了多少行代碼。

npm run dev 是用來在本地開發的時候做調試用的，vue開發的是前端的東西，不是nodejs 服務端程序，按道理講，生產環境里就不該存在npm，甚至nodejs也不需要（用nodejs來做web靜態服務的除外），樓主通過ssh進入到伺服器里，再運行npm run dev 來啟動哪是開發機上做的事情。正確的做法很簡單，通過npm run build 把生成的dist文件夾（不要上傳文件夾）里的內容上傳到http伺服器上就可以通過 http來訪問了，開發機上正常，上傳以後 程序出現錯誤不能運行的原因99.99%的可能性是你引用資源的路徑有問題。

一般如果vue框架的程序上傳到網站伺服器的根目錄下是不 會有問題的，也不存在資源文件引用錯誤的情況，但如果你不是根目錄，就會有問題，通過vue-cli 生成的開發目錄，build以後默認引用資源文件的路徑是

有更多疑問 」可以咨詢 」小鳥雲，它是的一家伺服器廠商，我一直在用他們產品！