Vue3学习笔记02：Vue3打包

Posted 2022-04-19 howard2005

文章目录

• 一、打包Vue项目
• • （一）查看Vue项目
  • （二）打包Vue项目
• 二、打开项目首页

一、打包Vue项目

（一）查看Vue项目

• 在【Vue3学习笔记01】里创建了Vue3项目vue3-demo
  

（二）打包Vue项目

• 进入项目目录vue3-demo，执行命令cnpm run build
  
• 执行完成后，会在Vue项目下会生成一个dist目录，该目录一般包含 index.html文件及static目录，里面包含了静态文件js、css以及图片目录 images（可能不存在）。
  

二、打开项目首页

• 双击打开dist目录里的index.html
  
• 看到的是一张空白页面
  
• 查看首页源码
  
• 把js、css文件路径修改为相对路径
  
• 再次打开首页index.html