是否有任何方法可以用Sass的@import命令导入一个常规的CSS文件?虽然我没有使用sass的所有SCSS语法，但我仍然喜欢它的组合/压缩功能，并且希望能够使用它，而不必将我的所有文件重命名为*.scss
当前回答
使用实例导入CSS文件到Sass。
Sass官方文档:将CSS导入Sass
其他回答
你必须在要包含的css文件前加上一个下划线，并将其扩展名切换为scss(例如:_yourfile.scss)。那么你只需要这样称呼它:
@import "yourfile";
它将包含文件的内容，而不是使用CSS标准的@import指令。
您可以使用第三方导入器来定制@import语义。
node-sass-import-once，它与node-sass (Node.js)一起工作，可以内联导入CSS文件。
直接使用的例子:
var sass = require('node-sass');,
importOnce = require('node-sass-import-once');
sass.render({
file: "input.scss",
importer: importOnce,
importOnce: {
css: true,
}
});
使用示例grunt-sass config:
var importOnce = require("node-sass-import-once");
grunt.loadNpmTasks("grunt-sass");
grunt.initConfig({
sass: {
options: {
sourceMap: true,
importer: importOnce
},
dev: {
files: {
"dist/style.css": "scss/**/*.scss"
}
}
});
注意，node-sass-import-once目前不能导入没有显式前导下划线的Sass部分。例如，使用文件partials/_partial.scss:
@ import泛音/ _partial。scss成功 @import * partials/partial。scss失败
一般来说，要注意自定义导入器可能更改任何导入语义。在开始使用之前请阅读文档。
现在可以使用:
@import 'CSS:directory/filename.css';
如果我是正确的，css与scss兼容，所以你可以将css的扩展名更改为scss，它应该继续工作。一旦你改变了扩展名，你可以导入它，它将包含在文件中。
如果你不这样做，sass将使用css @import，这是你不想要的。
好消息，Chris Eppstein创建了一个带有内联css导入功能的compass插件:
https://github.com/chriseppstein/sass-css-importer
现在，导入CSS文件就像这样简单:
@import "CSS:library/some_css_file"
