Question

我希望我的源映射是相对于CSS目录的子目录，例如

styles/css/components/
styles/css/components/maps/

使用我的base.css的源地图评论

/*# sourceMappingURL=maps/base.css.map */

在Google上阅读文档我觉得源地图只需要一个相对路径（我假设相对于CSS目录），但是没有浏览器似乎能够读取此URL，我做错了什么

我使用PostCSS btw，我的代码是：

postcss: {
  css: {
    src: 'styles/css/components/**.css',
    options: {
      map: {
        inline: false,
        annotation: 'styles/css/components/maps/',
      },
      processors: [
        require('autoprefixer')({browsers: 'last 2 versions'})
      ]
    }
  }
},

Answer 1

如果你使用gulp，这个插件会帮助你https://github.com/floridoo/gulp-sourcemaps

var gulp = require('gulp');
var plugin1 = require('gulp-plugin1');
var plugin2 = require('gulp-plugin2');
var sourcemaps = require('gulp-sourcemaps');

gulp.task('javascript', function() {
  gulp.src('src/**/*.js')
    .pipe(sourcemaps.init())
      .pipe(plugin1())
      .pipe(plugin2())
    .pipe(sourcemaps.write('../maps'))
    .pipe(gulp.dest('dist'));
});

CSS源地图可以位于子目录

1 个答案: