項目需要部署到甲方電腦上，使用docker是個不錯的選擇。
1、創建Dockerfile文件

# 設置基礎鏡像 FROM nginx:latest# 將dist文件中的內容復制到 /usr/share/nginx/html/ 這個目錄下面 COPY dist/ /usr/share/nginx/html/ # 用本地的 default.conf 配置來替換nginx鏡像里的默認配置 COPY default.conf /etc/nginx/conf.d/default.conf

2、創建鏡像中nginx配置文件

新建文件default.conf

# nginx配置 server {listen 80;server_name localhost;#charset koi8-r;access_log /var/log/nginx/host.access.log main;error_log /var/log/nginx/error.log error;location / {# root 根目錄，默認nginx鏡像的html文件夾，可以指定其他root /usr/share/nginx/html;index index.html index.htm;# 如果vue-router使用的是history模式，需要設置這個 try_files $uri $uri/ /index.html;}#error_page 404 /404.html;# redirect server error pages to the static page /50x.html#error_page 500 502 503 504 /50x.html;location = /50x.html {root /usr/share/nginx/html;} }

3、個人喜歡在package自定義命令：

"scripts": {"dev": "vue-cli-service serve --open","build": "vue-cli-service build","lint": "vue-cli-service lint","docker-build": "docker build -t bim-web ."},

4、構建鏡像使用命令

npm run docker-build

5、實例化容器

docker run -p 3000:80 -d --name bim-web bim-web

總結

以上是生活随笔為你收集整理的使用Dockerfile部署vue项目的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。