尝试使用 html + scss 将站点部署到 gitlab,但不知道该怎么做

Tried to deploy site with html + scss to gitlab and have no idea how to do that

我已经尝试过的所有方法都不适合我(youtube 上的几个网站和视频)。请 link 给我另一个有用的视频或帮助我理解这个过程。我发现使用 gh-pages 将站点部署到 GitHub 更容易,但是我在部署到 GitLab 时遇到了问题。

已经尝试将我的项目推送到 GitLab,然后是 CI/CD > Pipelines,我的项目在这里成功构建,然后是 Settings > Pages,但仍然是 404(等了 1 天多)。我已经安装了“.gitlab-ci.yml”文件(具有基本的 HTML 设置)。

顺便说一句,我应该推送预建站点还是已经转换的站点?

现在是这样的:

 - src
    - fonts
    - html
    - images
    - js
    - sass
    index.html
 .gitattributes
 .gitignore
 .gitlab-ci.yml
 LICENSE
 README.md

编辑:我找到了针对我的特定问题的解决方案。由于 GitLab Pages 是静态托管,在部署 sass 文件之前,您需要先编译它们,并且只有在部署之后才进行编译。 这是我的 gitlab-ci.yml 文件。

image: alpine:latest

stages:
    - compile
    - deploy
    
compile:
  stage: compile
  image: node:8.15-alpine
  script:
    - yarn global add node-sass
    - node-sass ./src/sass/main.scss ./src/css/styles.css --style compressed
  only:
      - master
  artifacts:
    paths:
      - ./src/css

pages:
  stage: deploy
  script:
  - mv src/ public
  artifacts:
    paths:
    - public

在编译阶段请注意我如何指向我的 main.scss 文件路径,这对您来说可能有所不同。还有编译文件的路径styles.css(需要使用css样式的文件名,即在主 html 文件的 <head> 部分中提到)。还要检查 artifacts 行的路径,以便您可以正确地定向文件。对于编译,如您所见,我使用的是 Yarn(无需安装任何东西即可使用)。编译我的 sass 文件后,下一阶段是部署,这对我来说按计划工作。

希望对你也有帮助!

要在 Gitlab 上成功托管您的页面,您需要将源代码移动到 public 目录并存档。例如 .gitlab-ci.yml 可以是:

image: alpine:latest

pages:
  stage: deploy
  script:
  - mv src/ public
  artifacts:
    paths:
    - public