1

我尝试使用我的 react 应用程序设置 gitlab 页面,但是,我无法做到这一点,因为它没有生成任何 url 供我访问。我已经设置了 gitlab-ci.yml。

> image: node:latest
pages:
  script:
    - npm install
    - npm run build
    - mkdir public2
    - mv public/* public2
  artifacts:
    paths:
      - public2
  only:
    - master
  stage: deploy
4

2 回答 2

5

为 React 应用设置 Gitlab 页面的示例:

第 1 步:我创建了一个 React 项目并推送到 gitlab

$ npx create-react-app hello-react

这是回购:https ://gitlab.com/ygou/hello-react

第二步:创建.gitlab-ci.yml如下图

https://gitlab.com/ygou/hello-react/blob/master/.gitlab-ci.yml

# Using the node alpine image to build the React app
image: node:alpine

# Announce the URL as per CRA docs
# https://create-react-app.dev/docs/advanced-configuration/
variables:
  PUBLIC_URL: /hello-react

# Cache node modules - speeds up future builds
cache:
  paths:
  - node_modules

# Name the stages involved in the pipeline
stages:
- deploy

# Job name for gitlab to recognise this results in assets for Gitlab Pages
# https://docs.gitlab.com/ee/user/project/pages/introduction.html#gitlab-pages-requirements
pages:
  stage: deploy
  script:
    - npm install # Install all dependencies
    - npm run build # Build for production
    - cp public/index.html public/404.html # Not necessary, but helps with https://medium.com/@pshrmn/demystifying-single-page-applications-3068d0555d46
    - mv public _public # CRA and gitlab pages both use the public folder. Only do this in a build pipeline.
    - mv build public # Move build files to public dir for Gitlab Pages
  artifacts:
    paths:
    - public # The built files for Gitlab Pages to serve
  only:
    - master # Only run on master branch

任务完成

CI/CD 作业完成后,您可以看到 React 应用程序的 Gitlab 页面:

https://ygou.gitlab.io/hello-react/

参考https ://ohmybuck.com/2018-08-12-build-a-react-website-with-full-cicd-in-two-minutes/

于 2019-06-07T21:39:41.157 回答
0

我很确定

artifacts:
    paths:
      - public2

需要是

artifacts:
    paths:
      - public

因此,您还可以删除- mv public/* public2构建将成功但部署将失败的命令,除非路径是公共的。

于 2018-05-07T22:01:52.123 回答