BundlerでSASSとCompassとSASS版Bootstrapをバージョン指定してインストールする方法

  • 0
    いいね
  • 0
    コメント

    RubyGemsでSASSとCompassとSASS版Bootstrapをインストールする方法 - Qiita の時とは違う方法でインストールしてみようと思いました。

    環境

    • OS : Windows10 64bit
    • RubyGems : 2.6.12

    インストールするもの

    • Bundler : 1.15.1
    • SASS : 3.4.24 (Selective Steve)
    • Compass : 1.0.3 (Polaris)
    • Bootstrap : bootstrap-sass-3.3.7

    RubyGemsをインストールする

    Windows10にRubyGemsをインストールする方法 - Qiita

    RubyGemsを最新化する

    $ gem -v
    2.6.11
    
    $ gem update --system
    RubyGems 2.6.12 installed
    Parsing documentation for rubygems-2.6.12
    Installing ri documentation for rubygems-2.6.12
    
    === 2.6.12 / 2017-04-30
    
    Bug fixes:
    
    * Fix test_self_find_files_with_gemfile to sort expected files. Pull
      request #1880 by Kazuaki Matsuo.
    * Fix issue for MinGW / MSYS2 builds and testing. Pull request #1879 by
      MSP-Greg.
    * Fix gem open to open highest version number rather than lowest. Pull
      request #1877 by Tim Pope.
    * Add a test for requiring a default spec as installed by the ruby
      installer. Pull request #1899 by Samuel Giddins.
    * Fix broken --exact parameter to gem command. Pull request #1873 by Jason
      Frey.
    * [Installer] Generate backwards-compatible binstubs. Pull request #1904
      by Samuel Giddins.
    * Fix pre-existing source recognition on add action. Pull request #1883 by
      Jonathan Claudius.
    * Prevent negative IDs in output of #inspect. Pull request #1908 by Vít
      Ondruch.
    * Allow Gem.finish_resolve to respect already-activated specs. Pull
      request #1910 by Samuel Giddins.
    
    === 2.6.11 / 2017-03-16
    
    Bug fixes:
    <省略>
    RubyGems installed the following executables:
            C:/app/Ruby24-x64/bin/gem
    
    Ruby Interactive (ri) documentation was installed. ri is kind of like man
    pages for ruby libraries. You may access it like this:
      ri Classname
      ri Classname.class_method
      ri Classname#instance_method
    If you do not wish to install this documentation in the future, use the
    --no-document flag, or set it as the default in your ~/.gemrc file. See
    'gem help env' for details.
    
    Updating rubygems-update
    Successfully installed rubygems-update-2.6.12
    Parsing documentation for rubygems-update-2.6.12
    Installing darkfish documentation for rubygems-update-2.6.12
    Done installing documentation for rubygems-update after 174 seconds
    Parsing documentation for rubygems-update-2.6.12
    Done installing documentation for rubygems-update after 0 seconds
    Installing RubyGems 2.6.12
    RubyGems system software updated
    
    $ gem -v
    2.6.12
    

    Bundlerをインストールする

    キャプチャ.PNG

    Bundlerというのは・・・

    ざっくり和訳 : アプリケーションの依存関係を管理し、複数のマシンで体系だって反復的にアプリケーションをインストールできる。

    Bundler manages an application's dependencies through its entire life, across many machines, systematically and repeatably
    bundler | RubyGems.org | your community gem host

    ※. 英語はとても弱いのでどなたか初心者向け一言和訳があれば教えてください。

    $ gem install bundler
    Successfully installed bundler-1.15.1
    Parsing documentation for bundler-1.15.1
    Installing ri documentation for bundler-1.15.1
    Done installing documentation for bundler after 38 seconds
    1 gem installed
    
    $ bundler -v
    Bundler version 1.15.1
    

    Gemfileを作成する

    # カレントディレクトリにシンプルなGemfile作成する
    $ bundle init
    Writing new Gemfile to C:/Users/UserName/Gemfile
    # Gemfileを編集する
    $ vi Gemfile
    ## ------ ここからGemfileの内容-------------
    # frozen_string_literal: true
    source "https://rubygems.org"
    
    # gem "rails"
    ## ----ここから下を追記する-----------
    gem 'compass','1.0.3'
    gem 'bootstrap-sass','3.3.7'
    

    Bundlerでインストールする

    $ bundle install
    Fetching gem metadata from https://rubygems.org/............
    Fetching version metadata from https://rubygems.org/...
    Fetching dependency metadata from https://rubygems.org/..
    Resolving dependencies...
    Fetching chunky_png 1.3.8
    Installing chunky_png 1.3.8
    Fetching multi_json 1.12.1
    Installing multi_json 1.12.1
    Fetching sass 3.4.24
    Installing sass 3.4.24
    Fetching rb-fsevent 0.9.8
    Installing rb-fsevent 0.9.8
    Fetching ffi 1.9.18 (x64-mingw32)
    Installing ffi 1.9.18 (x64-mingw32)
    Fetching execjs 2.7.0
    Installing execjs 2.7.0
    Using bundler 1.15.1
    Fetching compass-core 1.0.3
    Installing compass-core 1.0.3
    Fetching compass-import-once 1.0.5
    Installing compass-import-once 1.0.5
    Fetching rb-inotify 0.9.10
    Installing rb-inotify 0.9.10
    Fetching autoprefixer-rails 7.1.1.2
    Installing autoprefixer-rails 7.1.1.2
    Fetching compass 1.0.3
    Installing compass 1.0.3
    Fetching bootstrap-sass 3.3.7
    Installing bootstrap-sass 3.3.7
    Bundle complete! 2 Gemfile dependencies, 13 gems now installed.
    Use `bundle info [gemname]` to see where a bundled gem is installed.
    Post-install message from compass:
    $ sass -v
    Sass 3.4.24 (Selective Steve)
    $ compass -v
    Compass 1.0.3 (Polaris)
    Copyright (c) 2008-2017 Chris Eppstein
    Released under the MIT License.
    Compass is charityware.
    Please make a tax deductable donation for a worthy cause: http://umdf.org/compass
    

    Gemfile.lockの確認

    bundle installをするとGemfileと同じ場所にGemfile.lockが作成されます。
    Gemfile.lockは何かについては:arrow_double_down:がとても分かりやすかったです。

    gemfile.lockは、実際にgemをインストールした後の、「結果図」のようなものです。gem同士は関連し合っていることが多いので、gemfileに書いてあるgemの他にも必要なgemが生じます。Bundlerは、それらを自動でインストールし、gemfile.lockに記述します。
    (省略)
    gemfile.lockを使用することで、どの環境でも同じgem、gemのバージョンを使用することができるようになります。
    bundle install と bundle updateの違いについて - Qiita

    $ ls -l | grep 'Gemfile'
    -rw-r--r-- 1 m-uki 197609     126 6月  26 22:36 Gemfile
    -rw-r--r-- 1 m-uki 197609     808 6月  26 23:10 Gemfile.lock
    $ vi Gemfile.lock
    --------ここからGemfile.lockの内容--------------
    GEM
      remote: https://rubygems.org/
      specs:
        autoprefixer-rails (7.1.1.2)
          execjs
        bootstrap-sass (3.3.7)
          autoprefixer-rails (>= 5.2.1)
          sass (>= 3.3.4)
        chunky_png (1.3.8)
        compass (1.0.3)
          chunky_png (~> 1.2)
          compass-core (~> 1.0.2)
          compass-import-once (~> 1.0.5)
          rb-fsevent (>= 0.9.3)
          rb-inotify (>= 0.9)
          sass (>= 3.3.13, < 3.5)
        compass-core (1.0.3)
          multi_json (~> 1.0)
          sass (>= 3.3.0, < 3.5)
        compass-import-once (1.0.5)
          sass (>= 3.2, < 3.5)
        execjs (2.7.0)
        ffi (1.9.18-x64-mingw32)
        multi_json (1.12.1)
        rb-fsevent (0.9.8)
        rb-inotify (0.9.10)
          ffi (>= 0.5.0, < 2)
        sass (3.4.24)
    
    PLATFORMS
      x64-mingw32
    
    DEPENDENCIES
      bootstrap-sass (= 3.3.7)
      compass (= 1.0.3)
    
    BUNDLED WITH
       1.15.1