Question

我试图用插值（＃{''}）来逃避液体语法，但我收到了这个错误：

[22:07:05] Starting 'scss'...
[22:07:05] Finished 'scss' after 9.77 ms
[22:07:05] [gulp-sass] stylesheets/main.css
527:10  Invalid CSS after "  color: {": expected "}", was "ttings.color-te..."

当我从代码中删除所有液体语法时，任务运行完美。这是scss任务：

var gulp = require('gulp');
var watch = require('gulp-watch');
var sass = require('gulp-sass');
var cssnano = require('gulp-cssnano');
var rename = require("gulp-rename");
var autoprefixer = require('gulp-autoprefixer');
var sourcemaps = require('gulp-sourcemaps');
gulp.task('scss', function() {
    gulp.src('stylesheets/*.scss')
      .pipe(sass({ includePaths : ['./stylesheets/**/*.scss'] }))
    .pipe(sass().on('error', sass.logError))
    .pipe(sourcemaps.init())
    .pipe(autoprefixer({
      browsers: ['last 2 versions'],
      cascade: false
    }))
    .pipe(cssnano())
    .pipe(rename({ suffix: '.min.css', extname: '.liquid' }))
    .pipe(gulp.dest('./assets'));
  });
  gulp.task('watch', function() {
     gulp.watch('stylesheets/**/*.scss', ['scss']);
  });

如果我删除此部分＆gt;

 .pipe(sass().on('error', sass.logError))
    .pipe(sourcemaps.init())
    .pipe(autoprefixer({
      browsers: ['last 2 versions'],
      cascade: false
    }))
    .pipe(cssnano())

任务运行正常，但上传到shopify 时出现问题（错误无效的上传请求！） ...我也在其他任务中使用shopify-upload。

Answer 1

你不能使用gulp-saas来推断液体语法，它只会解析sass文件。

如果要解析液体文件，可以在编译sass文件之前使用gulp-liquify。

Answer 2

删除＆＃39; autoprefixer＆＃39;和/或＆＃c; cssnano＆＃39;

逃逸液体时出错（gulp-sass，shopify）

2 个答案: