Question

我要实现的目标是为gulp提供一个名为“ theme.scss”的文件，并使其输出一个名为“ theme.css.liquid”（用于shopify）的已编译的css / liquid文件，其源映射名为“ theme”。 css.map”。

这是我到目前为止的工作代码。

gulp.task('build-css', function() {
    return gulp.src(srcPath.cssMain)
    .pipe(plugins.sourcemaps.init())
    .pipe(plugins.sass({ outputStyle: 'nested' })
    .on('error', plugins.sass.logError)
    .on('error', handleErrors))
    .pipe(plugins.autoprefixer())
    // remove the extra set of quotations used for escaping the liquid string
    .pipe(plugins.replace('"{{', '{{'))
    .pipe(plugins.replace('}}"', '}}'))
    .pipe(plugins.sourcemaps.write('/'))
    .pipe(gulp.dest(destPath.css))
});

这将输出以下文件“ theme.css”和“ theme.css.map”，唯一的问题是我需要css文件包含液体扩展名。我尝试在sourcemaps.write之前使用以下代码重命名文件。但这将更改两者的名称，输出“ theme.css.liquid”和“ theme.css.liquid.map”。此外，“ theme.css.liquid”文件在其末尾缺少指向地图文件的链接。

 .pipe(plugins.rename({extname: 'css.liquid'}))"

我还尝试在写入源映射后进行raname，但是它将输出“ theme.css.liquid”和“ theme.css.css.liquid”（地图文件）。这是我最接近的工作版本，我只需要将地图文件重命名为“ theme.css.map”

任何帮助将不胜感激！谢谢！

如何让GULP重命名输出CSS文件而不重命名输出Sourcemap文件？

0 个答案: