带有 sass @imports 的 Rails 资产管道 [重复]

Posted 2023-03-06

【中文标题】带有 sass @imports 的 Rails 资产管道 [重复]

【英文标题】：Rails Asset Pipeline with sass @imports [duplicate]

【发布时间】：2015-09-19 15:19:37

【问题描述】：

我使用的是 Rails 4.2。

在我的 rails 项目目录中，我有一个前端目录：

/railsproject/frontend
/railsproject/frontend/styles
/railsproject/frontend/styles/main.scss
/railsproject/frontend/styles/variables.scss
/railsproject/frontend/node_modules/normalize.css/
/railsproject/frontend/node_modules/normalize.css/normalize.css

（我知道目录中带有句点是不寻常的，但我尝试更改目录名称和相应的@import 语句，但没有任何区别）

我已将config.assets.paths << Rails.root.join("frontend","styles") 添加到application.rb。

在/railsproject/app/assets/stylesheets/application.css:

@import "main.scss";

到目前为止一切都很好，它会加载/处理 main.scss 文件。

在/railsproject/frontend/styles/main.scss

@import 'variables'; // this works fine
@import '../node_modules/normalize.css/normalize.css'; // this does NOT work

第二次导入不起作用...我在 Chrome 控制台中收到 GET 错误，rails 服务器显示：

Started GET "/node_modules/normalize.css/normalize.css" for ::1 at 2015-07-02 15:55:38 +0800

ActionController::RoutingError (No route matches [GET] "/node_modules/normalize.css/normalize.css"):

我做错了什么？

【问题讨论】：

将您的导入行更改为：@import '../node_modules/normalize.css'; ?

抱歉 normalize.css 是一个目录...一个文件 /railsproject/frontend/node_modules/normalize.css/normalize.css 存在。我尝试删除目录名称和@import 中的句点，但没有帮助。

您可以尝试从 normalize.css 文件中删除 .css 扩展名吗？

成功了！有什么方法可以让 .css 扩展名正常吗？因为这就是节点包的分发方式......

检查这个：***.com/questions/7111610/… :) 它应该从 SASS 3.2.10 开始工作

【参考方案1】：

SASS 不允许您导入 CSS 文件，它希望 SCSS 文件编译成 CSS。 将您的文件扩展名切换到 SCSS 或升级到 SASS 3.2.10，它应该可以让您导入 CSS 文件。

参考：Import regular CSS file in SCSS file?

【讨论】：

要让它工作：你可以使用normalize.css作为文件名，但不能作为@import，它必须没有扩展名（../etc/normalize）。也许这对其有此问题的其他人有用

如果一个问题由另一个问题回答，则该问题应作为副本关闭。另外，目前没有可以导入 CSS 文件的 Sass 版本。