首页 > 解决方案 > Vue.js 应用程序不在 Gitlab 页面上运行

问题描述

我构建了一个 Vue.js Vuex 用户界面。它完美地工作(在我的笔记本电脑上)。我想将它部署在 Gitlab 页面上。

我使用了这里描述的文件(除了我升级了 Node.js 版本):

build site:
  image: node:10.8
  stage: build
  script:
    - npm install --progress=false
    - npm run build
  artifacts:
    expire_in: 1 week
    paths:
      - dist

unit test:
  image: node:10.8
  stage: test
  script:
    - npm install --progress=false
    - npm run unit

deploy:
  image: alpine
  stage: deploy
  script:
    - apk add --no-cache rsync openssh
    - mkdir -p ~/.ssh
    - echo "$SSH_PRIVATE_KEY" >> ~/.ssh/id_dsa
    - chmod 600 ~/.ssh/id_dsa
    - echo -e "Host *\n\tStrictHostKeyChecking no\n\n" > ~/.ssh/config
    - rsync -rav --delete dist/ user@server.com:/your/project/path/

该作业被标记为在管道上成功运行。但是,当我单击页面 URL 时,我会收到 404 HTTP 错误代码。

我错过了什么?

标签: vue.jsgitlabvuex

解决方案


当我尝试将 Vue.js 应用程序部署到 Gitlab 页面时,我遇到了类似的问题。经过数周的反复试验,我已经开始工作了。

看到上面的脚本,您就可以构建应用程序,对其进行单元测试并尝试将其部署到外部服务器。如果您在 Gitlab 页面中也需要它,则必须使用该pages作业。

这是我pages将 vue.js 应用程序部署到 Gitlab 页面的工作:

pages:
 image: node:latest
 stage: deploy
 script:
  - npm install --progress=false
  - npm run build
  - rm -rf public
  - mkdir public
  - cp -r dist/* public
 artifacts:
  expire_in: 1 week
  paths:
  - public
 only:
  - master

希望这就是你要找的。


推荐阅读