将项目部署至github和码云

2020-08-10  本文已影响0人  浪味仙儿啊

以Vue项目为例

本地预览
yarn build 之后会有一个dist目录
这时需要安装serve(原来的yarn serve是监听src目录的)去监听dist目录 yarn global add serve,执行 serve -s dist,端口就会发生变化,你会发现该端口内的css、js等文件都是打包好的,这两句命令就是检查dist是否正确打包。

GitHub页面

1、如果要推送到GitHub,要在GitHub新建一个仓库,用于预览(原仓库放源代码),并在vue.config.js中设置正确的publicPath。
如果要部署到https://<USERNAME>.github.io/,则可以省略,publicPath因为它默认为"/"。
如果要部署到预览仓库,请设置publicPath为"/<REPO>/"。例如,如果你的仓库名称是“ my-project”,则vue.config.js配置应如下所示:

module.exports = {
  publicPath: process.env.NODE_ENV === 'production'
    ? '/my-project/'
    : '/'
}

2、在项目中,deploy.sh使用以下内容创建并运行以进行部署:

#!/usr/bin/env sh

# 当发生错误时终止脚本
set -e

# 构建
yarn build

# cd 到构建输出的目录下
cd dist

#部署到自定义域名
# echo 'www.example.com' > CNAME

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

# 部署到 https://<USERNAME>.github.io
# git push -f git@github.com:<USERNAME>/<USERNAME>.github.io.git master

#部署到 https://<USERNAME>.github.io/<REPO>
# git push -f git@github.com:<USERNAME>/<REPO>.git master:gh-pages

cd -

需要注意git@github.com:<USERNAME>/<REPO>.git,这部分内容应更换为新仓库地址

部署sh deploy.sh

Gitee页面

只需要把deploy.sh中如下图部分的地址换成码云的就行了


image.png
上一篇下一篇

猜你喜欢

热点阅读