1、win上创建 vue项目 vue create 项目名
》
2、然后打包vue项目 npm run build
》
3、连接Xftp 7 将win(左)传入 连接的虚拟机中(右)(在虚拟机的/usr/创建docker) 然后传入vue项目打好包
》
4、在虚拟机中 docker安装nginx
1、搜索nginx镜像:docker search nginx
2、拉取nginx镜像:docker pull nginx
3、运行nginx镜像生成nginx容器:docker run -itd --name nginx-container -p 9999:80 nginx (nginx默认80)
4、访问nginx容器,测试nginx服务器是否启动正常:ip:9999,出现welcom to nginx。(在虚拟机中 ip addr查询地址 第二个)
5、进入nginx容器:docker exec -it nginx01 bash
然后cd /usr/share/nginx/html/ 该目录是用来部署静态网站。
(复制连接用于部署静态项目)
(进入到静态部署中 ls查看 如果有相同的文件,且用不到 可删除 rm(删除) -f(强制删除文件)r(目录) 相同的名称 )
6、然后ctrl+D 退出nginx容器
》
5、将传入的静态vue项目打包的/dist 部署到 nginx01中 docker cp ./dist nginx01:/usr/share/nginx/html/
》
6、vue项目部署后 重启nginx docker restart nginx名
》
7、到win上查看静态页面 虚拟机的ip地址/nginx设置的端口号/vue打包的项目名 http://192.168.142.128:9999/dist/
将vue项目传入到linux的部署nginx中
最新推荐文章于 2024-09-02 15:13:48 发布