css - 对于 Sass 如何命名 css 文件以免与其他 css 框架发生冲突?
问题描述
Sass 团队似乎已在 Sass 3.4 中删除了此功能,但我试图命名 Semantic UI CSS 库,以免与其他库冲突并且它不起作用。
.semantic-namespace {
@import "semantic-ui-css/semantic.min.css";
}
我得到这个错误
error sass/semantic-namespace.scss (Line 3: CSS import directives may only be used at the root of a document.)
似乎是说我只能在顶部使用@import。
找到了几年前的一些文档,但我认为它们太旧了,有些东西已经改变了。
解决方案
使用下划线命名您的内部文件,并以 scss 结尾。.是的,即使是普通的css,即semantic.min.css → _semantic.min.scss
有一个像这样的外部文件:
#main .content { // if that's, where you want them to rule only
@import 'semantic.min';
}
长话短说,接下来的语法:
导入(包含)原始 CSS 文件,语法.css
最后没有扩展名(导致实际读取部分 s[ac]ss|css 并将其包含在 SCSS/SASS 中):
@import "semantic.min";
以传统方式导入 CSS 文件 语法以传统方式进行,最后带有 .css 扩展名(结果为 @import url("semantic.min.css"); 在您编译的 CSS 中):
@import "semantic.min.css";
而且非常好:这种语法优雅简洁,而且向后兼容!它与 libsass 和 node-sass 配合得非常好。
推荐阅读
- c# - newtonsoft.json 的两个依赖版本
- bash - 运行 java -jar 命令时如何获取 unix 进程 ID
- sybase - 更新中的 Sybase CTE
- apache-spark - org.apache.spark.sql.catalyst.errors.package$TreeNodeException:绑定属性,树:EMP_SAL#7736
- linux - 分隔一行的 Bash 脚本包含“^A”
- laravel - 如何将用户变量传递给路由器
- matlab - Matlab 究竟如何执行 Lasso 分类?
- netsuite - NetSuite的用户事件脚本中oldRecord和newRecord有什么区别?
- java - QuickFIX/J Initiator - 在登录时设置用户名和密码
- java - IntelliJ 插件中用户可选择的运行时 Java 依赖项