• 请不要在回答技术问题时复制粘贴 AI 生成的内容
sufaith
V2EX  ›  程序员

请教下 vue 项目的部署流程

  •  1
     
  •   sufaith · Apr 20, 2019 · 8660 views
    This topic created in 2763 days ago, the information mentioned may be changed or developed.

    目前我是构建后,把 dist 文件 scp 上传到服务器,然后交给 nginx 托管, 全程手动操作, 做法像小作坊式的, 不知道大厂是如何操作的,请有相关经验的大佬给介绍下

    Supplement 1  ·  Apr 20, 2019
    如果有细化一点的方案,更好
    33 replies  •  2019-04-22 09:27:40 +08:00
    slimhigh
    slimhigh
    Apr 20, 2019
    1
    配个 CI Pipeline,把这个流程自动化。
    xsir
    xsir
    Apr 20, 2019
    2
    gitlab CI Pipeline docker 全自动部署
    LeoQ
    LeoQ
    Apr 20, 2019 via iPhone
    3
    阿里云 oss 可以考虑一下
    tinybaby365
    tinybaby365
    Apr 20, 2019
    4
    使用 gitlab ci 部署,先 docker multi stage 编译出 nginx+dist 的部署镜像,再触发 k8s 的滚动更新。
    linmq
    linmq
    Apr 20, 2019 via iPhone
    5
    raync 写个脚本,敲一个命令自动上传部署
    nekoleamo
    nekoleamo
    Apr 20, 2019
    6
    上家公司是创业公司,用的 pm2 自动部署,配置操作挺简单的,就是没法无缝更新,替换的时候会有十几秒无法访问
    shenyu1996
    shenyu1996
    Apr 20, 2019
    7
    自己小项目用的 buddy.works
    shingle
    shingle
    Apr 20, 2019 via Android
    8
    其实最简单的 docker+git 就可以,服务器初始化一个仓库(默认的 init 达不到效果,需要配置),docker 跑一个 nginx 然后把 dist 文件夹挂在进去,写一个 git hook 钩子自动触发更新
    shingle
    shingle
    Apr 20, 2019 via Android❤️1
    9
    之前写过一篇折腾...https://shingle.me/post/给 git 配置钩子实现服务器和客户端代码一致 /
    avenger
    avenger
    Apr 20, 2019 via iPhone
    10
    laravel + vue 的项目,用的这个

    https://deployer.org
    HarryQu
    HarryQu
    Apr 20, 2019
    11
    只有我一个人写 sh 脚本,打包、上传 ?

    看来得抽空研究下 ci 了。
    yuikns
    yuikns
    Apr 20, 2019
    12
    我有个简单的工程,build 完了 dist 放到 hou 这个 image 的 /app 下。整个流程都可以放到 Dockerfile 里面

    https://github.com/argcv/hou

    然后线上 pull + up 就行
    AngryMagikarp
    AngryMagikarp
    Apr 20, 2019
    13
    使用 Gitlab CI 的话需要在 Runner 所在的服务器配置一个 node 环境来编译,编译的时候会占用比较多的内存和 CPU。

    个人建议在你电脑上用 ansible 来自动化。没必要模仿所谓的大厂,大厂的人力资源是你们的几十倍,很多都有自己开发的一套发布系统。
    tomczhen
    tomczhen
    Apr 20, 2019
    14
    都用 webpack,加个 scp upload plugin 不算什么麻烦事吧。
    ericgui
    ericgui
    Apr 20, 2019
    15
    部署在 netlify 上 --- 如果是开源项目的话
    fmumu
    fmumu
    Apr 20, 2019 via Android
    16
    没人用 Jenkins 吗?
    chniccs
    chniccs
    Apr 20, 2019
    17
    像我这么原始的有么,本地生成 dist 目录,然后放到另一个源,推送上去,然后 webhook 服务器自动 pull。虽然 low,但我还用的挺开心的
    lihongjie0209
    lihongjie0209
    Apr 20, 2019
    18
    个人简单使用那写一个 rsync 脚本就可以了

    团队使用用 CI 工具持续集成
    lauix
    lauix
    Apr 20, 2019
    19
    自己写了个 python 脚本自动化部署,公司一般都是 Jenkins docker 部署
    YuansMine
    YuansMine
    Apr 20, 2019
    20
    GitHub webhook 还是基本能实现的,如果有更多的需求的话就得看看 CI 相关的知识了
    justin2018
    justin2018
    Apr 20, 2019
    21
    @avenger 收藏了 这个不错 😁
    jhsea3do
    jhsea3do
    Apr 20, 2019
    22
    @nekoleamo

    pm2 做后台进程的托管,类似 supervisord 或者 systemd, 但是 vue 打包应该和这个无关,只是 ci / repository 这块
    zhouhui
    zhouhui
    Apr 20, 2019❤️1
    23
    自己写一段?
    deploy.sh
    ```
    #!/bin/sh

    echo "开始编译...."
    npm run build
    echo "开始压缩..."
    cd dist && zip -r dist.zip *
    echo "开始上传..."
    scp dist.zip [email protected]:/opt/deploy/XXX
    cd ..
    scp run.sh [email protected]:/opt/deploy/XXX
    echo "开始删除编译代码..."
    rm -rf dist/
    echo "准备更新生产代码..."
    ssh [email protected] sh /opt/deploy/XXX/run.sh
    echo "发布成功..."
    ```
    run.sh
    ```
    #!/bin/sh

    base=/opt/deploy/XXX
    echo "删除多的文件..."
    rm -rf $base/css $base/dis $base/img $base/index.html $base/js $base/static
    echo "解压线上代码..."
    rm -rf $base/dist
    unzip $base/dist.zip -d $base
    echo "删除多余的文件..."
    rm -rf $base/dist.zip $base/run.sh
    echo "发布成功..."
    ```
    zhouhui
    zhouhui
    Apr 20, 2019
    24
    或者有机器也可以用 gitlab-ci 之类的东西。
    CallMeReznov
    CallMeReznov
    Apr 20, 2019
    25
    就 2-3 台机器是 LINUX,其他都是 200 台 windows.
    部署的时候都是手动(没更新,只增量),管理的话我都是写了批处理然后用 zabbix 监控后远程处理的.


    其实我也想搞持续集成持续部署..条件不支持啊
    bhaltair
    bhaltair
    Apr 20, 2019
    26
    上 docker 啊,再配合 gitlab ci,加上 k8s
    EI8xU01k92WdI1Mb
    EI8xU01k92WdI1Mb
    Apr 20, 2019
    27
    参考官方的指导打包为 docker
    https://cli.vuejs.org/guide/deployment.html#docker-nginx
    后续无论部署什么都简单了
    binaryify
    binaryify
    Apr 21, 2019
    28
    我这边用这个 ssh-webpack-plugin 插件

    plugins: [new SshWebpackPlugin({
    host: 'Remote host',
    port: 'Remote port',
    username: 'Remote username',
    password: 'Remote password',
    from: 'Deploy Local path',
    to: 'Remote full path',
    })]
    ericgui
    ericgui
    Apr 21, 2019
    29
    @binaryify 看着这个插件 2 年没更新了,还好用么?
    Cbdy
    Cbdy
    Apr 21, 2019 via Android
    30
    公司用 GitLab 的话还是建议用它提供的 CI 或 Web Hook
    参考: https://github.com/cbdyzj/lib17/blob/master/javascript/code/webhook.js
    binaryify
    binaryify
    Apr 21, 2019 via iPhone
    31
    @ericgui 用着没问题
    fumichael
    fumichael
    Apr 21, 2019
    32
    我目前也是“小作坊”操作
    cs419
    cs419
    Apr 22, 2019
    33
    会用 docker 可以考虑 drone 进行持续集成
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Privacy   ·   Solana   ·   4978 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 89ms · UTC 02:11 · PVG 10:11 · LAX 18:11 · JFK 21:11
    ♥ Do have faith in what you're doing.