将子目录设置为Github Pages上的网站根目录

k4ymrczo  于 2023-01-19  发布在  Git
关注(0)|答案(9)|浏览(312)

我正在使用Github Pages来托管和服务一个静态网站。
静态网站具有应用程序的典型目录结构:

.
├ source/
├ build/
│ └ index.html
├ .gitignore
├ config.rb
├ Gemfile
┆ ...
└ README.MD

index.html位于build/下,因此我希望将其设置为默认的www路径。
因此,当用户点击username.github.io时,它会呈现该子目录中的内容,但不会在URL上显示"/build/",因为它被设置为根文件夹。
注:

  • 我没有自定义域名,也不打算为此而定制域名,正如你所看到的,我正在尝试利用github提供的默认URL命名约定。
  • 不使用Jekyll也不使用自动页面生成器功能。
v09wglhw

v09wglhw1#

有一个详细的要点与所有需要的步骤。
要点如下:
https://gist.github.com/cobyism/4730490

从主旨

将子文件夹部署到GitHub页面

有时候你希望master分支上的一个子目录成为仓库gh-pages分支的根目录,这对于用Yeoman开发的站点,或者如果你有一个Jekyll站点包含在master分支中,以及你的其他代码,都是很有用的。
在本例中,假设包含站点的子文件夹名为dist

步骤1

从项目的.gitignore文件中删除dist目录(Yeoman默认忽略它)。

步骤2

确保git知道你的子树(站点所在的子文件夹)。

git add dist && git commit -m "Initial dist subtree commit"

步骤3

使用子树推送将其发送到GitHub上的gh-pages分支。

git subtree push --prefix dist origin gh-pages

如果你的文件夹不是dist,那么你需要在上面的每个命令中改变它。
如果您定期执行此操作,则还可以在路径中的某个位置包含create a script

#!/bin/sh
if [ -z "$1" ]
then
  echo "Which folder do you want to deploy to GitHub Pages?"
  exit 1
fi
git subtree push --prefix $1 origin gh-pages

它允许您键入如下命令:

git gh-deploy path/to/your/site
7rfyedvj

7rfyedvj2#

Since August 2016您可以将master分支的/docs子文件夹用于源代码。
因此,如果你可以告诉你的网站生成器使用/docs代替/build,你就完成了(没有子树)。

**注意:**正如@thislooksfun在评论中指出的,这只对项目页面(如<username>.github.io/<projectname>)有效,但对用户或组织页面(如<name>.github.io)无效。

y0u0uwnf

y0u0uwnf3#

不知何故,对我来说,被接受的答案只在第一次运行。重做会抛出错误。
我通过运行以下命令解决了这个问题:

git checkout --orphan gh-pages
git --work-tree build add --all
git --work-tree build commit -m 'gh-pages'
git push origin HEAD:gh-pages --force
git checkout -f master
2nbm6dog

2nbm6dog4#

为了让这个工作的gh-pages分支为hugo网站使用public/文件夹,这里是我的工作是超级hacky,但得到的工作完成:

  • 注意:hugolanding是你的config.toml所在的根目录,这个脚本在scripts文件夹下运行,你完全可以把它移到其他地方并修改那一行。*
#!/bin/bash
# move to root
cd ../hugolanding
# generate public content
hugo -D
# prep copy folder
rm -rf /tmp/public && mkdir -p /tmp/public
# copy out of git shit
cp -R public/* /tmp/public
# git yolo everything
git add -A 
git commit -m 'updates to public'
git push --recurse-submodules=on-demand
git checkout gh-pages
cd ..
cp -R /tmp/public/* .
git add -A 
git commit -m 'updated gh-pages'
git push --recurse-submodules=on-demand
echo "done"
git checkout main
qzwqbdag

qzwqbdag5#

我认为git-worktree和从一个单独的分支部署是一个更干净的选择,因为我不会在main分支中有提交,也不会有来自重新部署的提交,我发现这更简洁,而且如果我使用git subtree,我不必每次都删除远程分支,这是不必要的。
git-worktree将您的子目录dist挂载到单独的分支gh-pages(在本例中)。
具体方法如下:

git branch --track gh-pages origin/gh-pages # Create new gh-pages branch; Add tracking    
git checkout --orphan gh-pages              # Initialize gh-pages without main's history
git reset --hard                            # Remove all history
git commit --allow-empty -m "Init"          # First commit without any files
git checkout main                           # Go back to main (or master) branch
git worktree add dist gh-pages              # Mount dist and bind it to the gh-pages branch

distnpm构建脚本,如下所示:

"scripts": {
  ...
  "dist": "ng build --configuration production && echo 'gitdir: /home/<user>/<repo>/.git/worktrees/dist' > ./dist/.git"
  ...
}

它所做的只是重新创建git-worktree引用,因为dist中的.git文件在默认情况下被ng build删除了,git需要这个引用来将dist链接到索引。
工作流程是这样的:

npm run dist            # Build website with new changes; Removes dist and re-creates it
cd dist                 # Move to gh-pages branch by switching into a directory (cool huh)
git add .               # Add all generated files to staging area
git commit -m "v0.0.3"  # Update the version history of the gh-pages branch
git push                # Push changes to gh-branch

如果您运行git status,它将回复On branch gh-pages
git log将显示一个提交"Init"
但是当您cd ..并再次运行git status时,响应将是On branch main
git log会显示你对main的所有原始提交。
这里发生的事情非常有趣,文件夹dist现在有了一个单独的分支,有了它自己的、与main无关的历史记录,你所要做的就是切换到cd dist来访问那个分支(gh-pages)。
这与git checkout dist不同,git checkout dist会将dist目录和自动生成的构建文件附加到您的工作树中,混合了main和部署历史,这很不方便。
在这里,您的src文件将保持不变,以及它们自己在maincd ..中的历史记录,只有部署所需的文件才会位于此分支上,这非常方便,因为它将src历史记录与部署历史记录分开。
现在你要部署的不是从文件夹,而是从分支,分支中保存着你网站的最新编译版本,它是从/(root)构建的。
index.html位于build/下,因此我想将其设为默认www路径。
在这里,请确保您创建的存储库是<username>.github.io。我犯了同样的错误,使用了不同的存储库名称,并感到沮丧。
因此,当用户点击www.example.com时,它会呈现该子目录中的内容,但不会在URL上显示"/build/",因为它被设置为根文件夹。username.github.io it renders the content within that subdirectory and yet it doesn't show "/build/" on the URL, cause that's set as the root folder.
当然这里也可能有改进,例如让npm run dist完成所有这些,但是我个人更喜欢手工完成这些步骤。
阅读更多关于here方法的信息。
但是我同意,如果你在一个团队工作,使用像gh-pages这样的工具在你的项目中执行标准可能会更好。
我希望我的解释在某种程度上也是一种贡献,而不仅仅是对上面提到的方法的重述。

t0ybt7op

t0ybt7op6#

如果你想这样做,因为你有一个react应用程序或类似的东西,在https://github.com/gitname/react-gh-pages中描述的步骤,将解决你的问题。

sg3maiej

sg3maiej7#

在package.json中添加主页,如下所示

"homepage": "https://gamingumar.com/watcher",
yshpjwxd

yshpjwxd8#

使用工作树功能将dist文件夹从master分支发布到gh-pages分支。
要点:https://gist.github.com/ErickPetru/b1b3138ab0fc6c82cd19ea3a1a944ba6

设置

首先,你需要一个gh-pages,如果你没有,创建:

git branch gh-pages

这会创建一个基于master HEAD的分支,但master分支的文件和git历史在gh-pages分支上没有意义,使用--orphan分支,你可以用一种干净的方式初始化gh-pages

git checkout --orphan gh-pages
git reset --hard
git commit --allow-empty -m "Init gh-pages branch"
git checkout master

然后,使用git worktree将分支挂载为子目录:

git worktree add dist gh-pages

如果你没有忽略dist文件夹,那么忽略它,这样你就不会在master分支提交中意外地添加生成的文件。

echo "dist/" >> .gitignore

展开

每次构建静态包时,生成的文件都在dist目录中,由于dist文件夹现在是gh-pages分支,因此您可以直接通过创建一个提交并推送来部署它。

cd dist
git add --all
git commit -m "Deploy on gh-pages updated"
git push origin gh-pages

这样就不会向master分支历史中添加任何内容,从而保持其干净。

n9vozmp4

n9vozmp49#

push-dir将执行此操作:

npm install push-direxample
push-dir --dir=build --branch=gh-pages

相关问题