vue專案部署到docker中

2022-06-07 23:15:08 字數 1053 閱讀 9699

通過nginx映象部署

vue專案npm run build打包成dist目錄,有的打包會加上版本號

啟動 docker

將dist目錄通過xftp拷貝到linux伺服器上,同目錄下新建dockerfile

from nginx

copy ./dist/ /usr/share/nginx/html/

copy nginx.conf /etc/nginx/nginx.conf

第一句指定基礎映象

第二句將dist目錄下內容拷貝到容器中的/usr/share/nginx/html/目錄

第三句將nginx.conf配置檔案拷貝到容器中

nginx.conf如下

如果需要反向**後台介面,需要加一句

location ^~ /api/ 

這樣所有帶/api/的訪問請求都會**到

打包映象

當前目錄下執行:docker build -t nginx-test .

後面的 . 不能省

執行容器

docker run --name nginx-docker -p 8050:80 -d nginx-test

瀏覽器輸入localhost:8005就可以訪問了前端頁面了

對於有版本號的vue專案打包後路由找不到對應的頁面,瀏覽器會報loading chunk failed,我沒找到專案的原因,不知道具體原因是什麼只好把static資料夾拷到dist目錄下,重新生成映象執行就可以了。

vue專案部署到Tomcat中

1,假設你要訪問的專案名稱為 hms 3,配置config index.js檔案,build 選項裡面 設定assetspublicpath 否則訪問時會出現空白頁,頁面刷不出來。4.使用vue router的情況 當你在專案中使用vue router的時候,就需要給src router index...

vue 專案部署到 nginx中

web學習筆記 一 vue專案部署到nginx 確定伺服器ip位址,和埠位址 a.ip 123.123.123.123 b.nginx監聽的埠 8085 c.服務部署埠 8125 編寫nginx的配置檔案 a.注意監聽的埠是8085 b.服務介面與websocket的支援配置 介面location ...

vue專案部署到Tomcat方法

1.vue專案路由配置 專案上線,一般需要新增專案名,並且消去vue router產生的 號,需要在router的配置下,在本專案是router index.js下配置 import vue from vue import router from vue router vue.use router ...