我使用以下方法创建了一个新的 rails 应用程序:
rails new blah --webpack -T
然后我添加了primer
yarn add primer
如果我在/assets/stylesheets/application.scss 中执行此操作，我的导入将有效
@import "~primer/index.scss";
Primer 有很多模块，因此primer/index.scss 然后引用其他模块的文件。因此，即使我将 tilda 放在第一次导入中，它也不能解决问题，因为在其他文件中它没有 tilda。
但问题是，一旦 index.scss 文件加载，还有其他文件停止工作，因为它们也引用了如下文件:
// Core modules
@import "primer-base/index.scss";
@import "primer-box/index.scss";
@import "primer-breadcrumb/index.scss";
@import "primer-buttons/index.scss";
@import "primer-table-object/index.scss";
@import "primer-forms/index.scss";
@import "primer-layout/index.scss";
@import "primer-navigation/index.scss";
@import "primer-pagination/index.scss";
@import "primer-tooltips/index.scss";
@import "primer-truncate/index.scss";
所以这些进口也必须改变。我需要解决这个问题，所以我不必使用 tilda 符号作为前缀。我的 assets.rb 已经包含 node_modules 所以我不确定我还能做什么？
我的/initializers/assets.rb 有这个:
Rails.application.config.assets.paths << Rails.root.join('node_modules')
然而，在我的 application.scss 文件中，我必须包含 tilda 符号才能引用 scss 文件:
@import "primer/index.scss";
html {
font-size: 30px;
}
应用程序.js 文件:
import "./application.scss";
console.log('Hello World from Webpacker2d');
我的布局文件:
<!DOCTYPE html>
<html>
<head>
<title>Blah</title>
<%= csrf_meta_tags %>
<%= csp_meta_tag %>
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>
<%= javascript_pack_tag 'application' %>
<%= stylesheet_pack_tag 'application' %>
</head>
<body>
<%= yield %>
</body>
</html>
最佳答案
预处理所有这些文件以添加波浪号是一个可接受的解决方案吗？如果是这样，您可以在 *nix 机器中对单个文件执行此操作:
cat some_file.scss | ruby -ne 'print $_.sub(/(@import\s*\")([^~])/) { "#{$1}~#{$2}" }' > some_file.scss.tilde
mv some_file.scss.tilde some_file.scss
对于多个文件:
for file in $(ls *.scss); do
cat "$file" | ruby -ne 'print $_.sub(/(@import\s*\")([^~])/) { "#{$1}~#{$2}" }' > "$file.tilde"
mv "$file".tilde "$file"
done
这会将您的 scss 文件替换为在任何
@import 中添加波浪号的版本。尚未拥有它的声明。更具体地说，它匹配 @import后跟任何空格，后跟双引号，后跟不是波浪号的东西，并在那个不是波浪号的东西之前放一个波浪号。您可能想跳过
mv行首先测试输出。如果您必须多次执行此操作，则可以将其写入 rake 任务或脚本中。
关于ruby-on-rails - 如何在没有 tilda 的情况下从 node_modules 导入 scss 文件？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/52731269/