如何将Vue项目打包并上传GitHub，实现GitHub Pages预览？

本文共计568个文字，预计阅读时间需要3分钟。

在Vue项目中，打包并上传到GitHub并实现GitHub Pages预览：

1. 打包Vue项目：在命令行中输入打包命令 `npm run build`，生成dist文件夹。

2.上传到GitHub：将dist文件夹中的内容上传到GitHub仓库的相应分支。

3.配置GitHub Pages：在GitHub仓库的设置中，选择GitHub Pages，并配置分支为存放dist文件夹的分支。

常见问题及解决方法：

1.项目资源无法加载：检查项目中的资源路径是否正确，确保资源文件已包含在dist文件夹中。

vue项目打包后上传至GitHub，并实现github-pages的预览

1. 打包vue 项目

vue项目：

命令行输入打包命令npm run build，生成了dist文件夹：

打包完成。

打包常见问题1——项目资源无法加载

打开刚刚打包好的dist文件夹，浏览器打开index.html

发现该页面是空白的，打开控制台发现

这里看到index.html文件中没有加载任何css、js文件。