Rails將Bootstrap從3遷移到4。找不到或不可讀的導入文件：bootstrap / normalize

Question

因此，我正在嘗試將此應用程序從Bootstrap 3更新到4，並收到以下消息：

找不到或不可讀的導入文件：引導程序/規范化

的Gemfile：

ruby '2.5.1'

gem 'bootsnap', '>= 1.1.0', require: false
gem 'bootstrap', '~> 4.1.3'
gem 'dotenv-rails'
gem 'dropzonejs-rails'
gem 'jquery-rails'
gem 'kramdown'
gem 'nokogiri', '~> 1.6', '>=1.6.7'
gem 'oauth2'
gem 'pg', '~> 0.21'
gem 'puma', '~> 3.11'
gem 'rails', '~> 5.2.0'
gem 'rake', '~> 12.3.1'
gem 'redis'
gem 'rollbar'
gem 'sass-rails', '~> 5.0'
gem 'sidekiq'
gem 'uglifier', '>= 1.3.0'
gem 'verbalize'
gem 'whenever'
gem 'will_paginate', '~> 3.1.0'

的application.js

//= require rails-ujs
//= require rails-validator
//= require jquery3
//= require popper
//= require bootstrap
//= require_tree .

Application.scss

@import "bootstrap";
@import "imports/bootstrap_theme";
@import "imports/bootstrap_modules";
@import 'imports/variables';

Gemfile.lock的

bootstrap (4.1.3)
  autoprefixer-rails (>= 6.0.3)
  popper_js (>= 1.12.9, < 2)
  sass (>= 3.5.2)
bootstrap-sass (3.3.7)
  autoprefixer-rails (>= 5.2.1)
  sass (>= 3.3.4)

Application.html.erb最初具有以下內容：

<head>    
<!--Bootstrap Meta Tags-->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!--Font Awesome CSS-->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css" >
<!--Bootstrap CSS-->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
</head>
<body>
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script>window.jQuery || document.write('<script src="../../assets/js/vendor/jquery-slim.min.js"><\/script>')</script>
<script src="../../assets/js/vendor/popper.min.js"></script>
<script src="../../dist/js/bootstrap.min.js"></script>

<!-- Icons -->
<script src="https://unpkg.com/feather-icons/dist/feather.min.js"></script>
<script>
  feather.replace()
</script>


<%= yield %>

<!-- Bootstrap JS-->
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
</body>

當我將所有內容移至bootstrap 4 gem時，我從application.html.erb文件中刪除了上面的內容。

我注意到bootstrap-sass仍在Gemfile.lock中，但我一生都無法弄清為什么存在/卸載它。

如果我在Application.scss中刪除導入組，則最終得到

找不到或不可讀的導入文件：引導鏈輪。

突出顯示以下內容：<％= stylesheet_link_tag'應用程序'，媒體：'所有'％>

更新了我的Application.scss文件，使其看起來像：

@import "imports/bootstrap_theme";
@import "imports/bootstrap_modules";
@import 'imports/variables';
@import "bootstrap";

現在，結果為：

$ color：'theme-color（“ primary”）'不是'darken'的顏色

我的文件中缺少什么嗎？

Answer 1

您可能已經引用了imports/bootstrap_modules或其他文件上已由bootstrap/reboot替換的bootstrap/normalize 。 Bootstrap更改了模塊，因此您必須對文件進行更改。

另外，請注意，如果要使用@import "bootstrap";導入所有內容，則不必導入import imports/bootstrap_modules @import "bootstrap";

另請參閱此gem文件夾以獲取可用的導入。

請提供相關信息，例如導入的文件，如果您需要更具體的答案

Rails將Bootstrap從3遷移到4。找不到或不可讀的導入文件：bootstrap / normalize

問題描述

1 個解決方案

解決方案1
0 2018-11-20 08:30:00

Rails將Bootstrap從3遷移到4。找不到或不可讀的導入文件：bootstrap / normalize

問題描述

1 個解決方案

解決方案1 0 2018-11-20 08:30:00

解決方案1
0 2018-11-20 08:30:00