Spree
Rails 5.2 アプリで(を使用するbootstrap-sass
) と Material Design Bootstrap ( https://mdbootstrap.com/ ) の両方を使用しようとしていますが、その組み合わせによっていくつかの不幸なエラーが発生しています。
具体的には、ページを読み込もうとすると、次のエラーが発生します。
Sass::UnitConversionError at /
Incompatible units: 'rem' and 'px'.
このエラーを調べると、これが rem と px を組み合わせて calc を使用した場合のエラーであることを示すthis、this、およびthisのような投稿が表示されます。ただし、次の行で呼び出されていますvendor/assets/stylesheets/mdb/core/bootstrap/_variables.scss
。
$input-height-inner: ($font-size-base * $input-btn-line-height) + ($input-btn-padding-y * 2) !default;
そして、対応する各変数をチェックしましたが、いずれも px 値を含みません。
$font-size-base: 1rem !default; // Assumes the browser default, typically `16px`
と
$input-btn-line-height: $line-height-base !default;
そして順番に
$line-height-base: 1.5 !default;
そして最後に
$input-btn-padding-y: .375rem !default;
私のgemfileは現在次のようになっています:
source 'https://rubygems.org'
git_source(:github) { |repo| "https://github.com/#{repo}.git" }
ruby '2.5.0'
gem 'rails', '~> 5.2.1'
gem 'puma', '~> 3.11'
gem 'puma_worker_killer'
gem 'sass-rails', '~> 5.0'
gem 'uglifier', '>= 1.3.0'
gem 'coffee-rails', '~> 4.2'
gem 'jbuilder', '~> 2.5'
gem 'mini_magick', '~> 4.8.0'
gem 'devise'
gem 'bootsnap'
# gem 'bootstrap', '~> 4.2.1'
gem 'jquery-ui-rails'
gem 'sprockets-rails'
gem 'bootstrap-sass'
gem 'bcrypt', '~> 3.1.7'
gem 'friendly_id', '~> 5.2.0'
gem 'stripe'
gem 'figaro'
gem 'magnific-popup-rails', '~> 1.1.0'
gem 'simple_form'
gem 'acts-as-taggable-on', '~> 6.0' #must be this version for Rails5
gem 'aws-sdk' , '~> 3'
gem 'aws-sdk-s3', require: false
# gem 'simple_form_extension'
gem 'recaptcha', require: "recaptcha/rails"
gem 'font-awesome-rails'
gem 'font-awesome-sass'
gem 'font_awesome5_rails'
# gem 'trix-rails', require: 'trix'
gem 'rack-tracker'
gem 'high_voltage', '~> 3.1'
gem 'convertkit-ruby', require: 'convertkit'
gem 'dotenv-rails'
gem 'acts_as_list'
gem 'wysiwyg-rails'
gem 'will_paginate'
gem 'searchkick'
gem 'spree', '~> 3.7.0.rc1'
gem 'spree_gateway', '~> 3.4'
gem 'spree_remove_bs3', github: 'matthewkennedy/spree_remove_bs3'
gem 'spree_bs4', github: 'matthewkennedy/spree_bs4'
group :production do
gem 'pg', '~> 0.20.0'
end
group :development, :test do
gem 'byebug', platforms: [:mri, :mingw, :x64_mingw]
gem 'pg', '~> 0.20.0'
end
group :development do
gem 'web-console', '>= 3.3.0'
gem 'listen', '>= 3.0.5', '< 3.2'
gem 'spring'
gem 'spring-watcher-listen', '~> 2.0.0'
gem 'binding_of_caller'
gem 'better_errors'
gem 'pg', '~> 0.20.0'
end
group :test do
gem 'capybara', '>= 2.15', '< 4.0'
gem 'selenium-webdriver'
gem 'chromedriver-helper'
end
gem 'tzinfo-data', platforms: [:mingw, :mswin, :x64_mingw, :jruby]
そして、次の imports/require が my にありますapplication.scss
:
*= require magnific-popup
*= require jquery-ui
*= require_tree .
*= require_self
*/
@import "bootstrap-sprockets";
@import "bootstrap";
@import 'font_awesome5_webfont';
@import 'font_awesome5.css';
@import 'bootstrap-datetimepicker';
@import 'froala_editor.min';
@import 'froala_style.min';
@import 'font-awesome-sprockets';
@import 'font-awesome';
@import 'plugins/char_counter.min.css';
@import 'plugins/code_view.min.css';
@import 'plugins/colors.min.css';
@import 'plugins/fullscreen.min.css';
@import 'plugins/image_manager.min.css';
@import 'plugins/image.min.css';
@import 'plugins/line_breaker.min.css';
@import 'plugins/quick_insert.min.css';
@import 'plugins/special_characters.min.css';
@import 'plugins/table.min.css';
@import 'third_party/embedly.min.css';
@import 'third_party/spell_checker.min.css';
@import 'mdb/mdb';
このsassエラーを制御するのを手伝ってくれる人はいますか? エラーがすべてのページにあるため、これを修正するまで、アプリは完全に使用できません。