vue项目部署

Posted on

  1. 先新建一个Gemfile 

    1
    2
    3
    source 'https://gems.ruby-china.com'
    	gem 'capistrano', '2.12.0'
    	gem 'capistrano-rbenv', '1.0.1'

  2. $ bundle install

  3. $ bundle exec capify .

  4. 配置deploy文件 

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    # -*- encoding : utf-8 -*-
    require 'capistrano-rbenv'
    load 'deploy/assets'
    SSH_USER = 'root'
    set :rake, "bundle exec rake"
    set :application, "xxx"
    #set :application, "xxx"
    set :repository, "./dist"
    set :scm, :none
    # Or: `accurev`, `bzr`, `cvs`, `darcs`, `git`, `mercurial`, `perforce`, `subversion` or `none`
    set :deploy_via, :copy
    #测试服务器
    ssh_options[:port] = xxx
    server = "xxx"
    #正式服务器
    #server = "xxx"

    role :web, server
    role :app, server                          # This may be the same as your `Web` server
    role :db,  server, :primary => true # This is where Rails migrations will run
    role :db,  server

    set :deploy_to, "xxx" #项目路径

    set :copy_exclude, [".git", "node_modules", "src"]
    default_run_options[:pty] = true

    set :user, SSH_USER

    namespace :deploy do

      task :restart, :roles => :app, :except => { :no_release => true } do
        run "nginx -s reload"
      end 

      namespace :assets do
        task :precompile do
          puts "== 这个命令没有用，但是rails中每次都会执行，所以使用空语句覆盖它。"
          #run "bundle install"
          #run "cd #{release_path} && bundle exec rake RAILS_ENV=production RAILS_GROUPS=assets assets:precompile "
        end 
        task :symlink do
          puts "== 这个命令没有用，但是rails中每次都会执行，所以使用空语句覆盖它。"
        end 
      end 
    end

    desc "编译vuejs"
    task :build_vue do
      puts '== 清空 dist 文件夹'
      puts `rm -rf dist/*`
      puts "== 编译 vuejs:"
      puts `npm run build`
    end

    task :remove_redundant_files do
      puts "== 删掉远程无用的文件夹： log, public, tmp"
      run "cd #{release_path} && trash log public tmp REVISION"
    end

    before "deploy", :build_vue
    after "deploy", :remove_redundant_files

  5. 配置nginx

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    server {
      listen 443 ssl;
      charset utf-8;
      server_name vue1.wondercv.com;
      ssl_certificate /opt/ssl/wondercv/wondercv.com.crt;
      ssl_certificate_key /opt/ssl/wondercv/wondercv.com.key;
      ssl_session_cache shared:SSL:1m;

      # 第一步,把所有的 mysite.com/api/interface  转换成:   mysite.com/interface
      location /api {
        rewrite    ^(.*)\/api(.*)$    $1$2;
      }

      # 第二步，　把所有的 mysite.com/interface 的请求，转发到 siwei.me/interface
      location /interface {
        proxy_pass          http://siwei.me;
      }

      location / { 
        root /opt/app/vue1.wondercv.com/current;
      }
    }

    server {
      listen 80; 
      server_name vue1.wondercv.com;
      return 301 https://$server_name$request_uri;
    }

  6. 在本地 $ bundle exec cap deploy:setup
    ps: 创建完文件夹及时停止

  7. $bundle exec cap deploy