我在这里遇到了 bootstrap-sass 的问题。我正在尝试通过 Gulp 和我的 style.scss
中的其他一些 scss 库来编译 Bootstrap 。文件,但它抛出了这个错误:
Message:
css/dev/style.scss
Error: media query expression must begin with '('
on line 1 of css/dev/style.scss
>> @import 'breakpoint-slicer'
---------------------------^
Details:
formatted: Error: media query expression must begin with '('
on line 1 of css/dev/style.scss
>> @import 'breakpoint-slicer'
---------------------------^
column: 28
line: 1
file: /home/nano/Sandbox/bolt-seed/theme/own-theme/css/dev/style.scss
status: 1
messageFormatted: css/dev/style.scss
Error: media query expression must begin with '('
on line 1 of css/dev/style.scss
>> @import 'breakpoint-slicer'
---------------------------^
messageOriginal: media query expression must begin with '(' relativePath: css/dev/style.scss
我只是做一个
_variables.scss
复制到我的根样式文件夹(暂时没有更改),我得到了错误。如果我包含 breakpoint-slicer
则相同在我的进口中。这是我的 gulp 任务和我的
style.scss
gulp 任务
gulp.task('sass-build', () => {
return gulp.src('./css/dev/*.scss')
.pipe(plumber())
.pipe(sourcemaps.init())
.pipe(sass({
includePaths: [
'./assets/bootstrap-sass/assets',
'./assets/breakpoint-slicer/stylesheets',
],
outputStyle: 'compressed'
}))
.pipe(sourcemaps.write('./css'))
.pipe(gulp.dest('./css'));
});
样式.scss:
@import 'breakpoint-slicer'
@import 'variables'
@import 'bootstrap'
body {
padding: 50px
}
所有 Assets 均由 Bower 在
assets
中管理。文件夹。有什么想法或暗示吗?
最佳答案
可能有几个原因。一是该文件不在您认为与 gulpfile 相关的位置。我刚刚在本地重新创建了这个问题,除非我有正确的 includePaths
它不起作用。
不正确:(stylesheet.scss)
当我更正它时,文件导入没有任何问题:
例如
.pipe(sass({
outputStyle: 'nested',
includePaths: [
'./bower_components/breakpoint-slicer/stylesheets'
]
}))
您确定 gulpfile 正确读取了该路径吗?
如果您 100% 正确认为 url 没问题,那么您需要重新访问您的 sass 文件 - 在其中包含部分文件 - 我注意到您没有分号 - 在每次导入结束时确实需要它们.把它们放进去,然后你的代码应该没问题
没有分号 - 任务失败
用分号 - 任务构建就好了:
关于twitter-bootstrap - Bootstrap sass + gulp : Media query expression must begin with '(' ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37009347/