Vue项目在github上部署

Mi Manchi-Jiang

于 2022-04-22 20:27:23 发布

阅读量2.2k

点赞数

文章标签： vue

本文链接：https://blog.youkuaiyun.com/m0_62883848/article/details/124354347

版权

本文详细介绍了如何将Vue项目部署到GitHub Pages。主要步骤包括在GitHub创建仓库，修改vue.config.js，创建deploy.sh脚本，处理构建错误，以及上传dist文件夹。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

如何将Vue项目部署到github上？

在github上创建两个仓库，一个放源码，一个放展示页面。放源码的仓库操作步骤照常。今天重点讲如何部署展示页面。

1.在github上创建仓库（xxx）

2.在项目文件夹中的vue.config.js中插入

 publicPath: process.env.NODE_ENV === 'production'
    ? '/SkyLineWebsite/'//这里写展示页面的仓库名称
    : '/',

3.在根目录新建一个deploy.sh的文件，将以下代码复制进去

#!/usr/bin/env sh

# abort on errors
set -e

# build
npm run build

# navigate into the build output directory
cd dist

# if you are deploying to a custom domain
# echo 'www.example.com' > CNAME

git init
git add -A
git commit -m 'deploy'

# if you are deploying to https://<USERNAME>.github.io
# git push -f git@github.com:<USERNAME>/<USERNAME>.github.io.git main

# if you are deploying to https://<US