grunt-contrib-sass 阻止源映射

Question

我的 Grunt 设置是使用 sass 将我的 .scss 文件编译为 src/.css，并使用 cssmin 将我的 src/.css 文件合并并缩小为 main.css。

我想使用 SASS 中的新源映射功能，但考虑到 cssmin 会将我所有的 css 文件放入 main.css 中，我不确定它是否真的对我有任何作用。

有人对此有任何见解吗？

我现在也在尝试关闭 grunt-contrib-sass 中的源映射，但行不通。这是我的 Gruntfile.js 中的相关代码：

sass: {
  dist: {
    options: {
      sourcemap: 'none'
    },
    files: [{
      expand: true,
      cwd: 'stylesheets/scss',
      src: ['**/*.scss'],
      dest: 'stylesheets/src',
      ext: '.css'
    }]
  }
},

来自：github.com/gruntjs/grunt-contrib-sass

Answer 1

我刚刚遇到了这个问题，其他解决方案对我没有帮助。这是我修复它的方法：

options: {
  "sourcemap=none": ''
}

使用sass版本3.4.2，并且

npm update

没有帮助

Answer 2

我遇到了同样的问题。正如@imjared 在上面的评论中所建议的，更新 grunt-contrib-watch 和 grunt-contrib-sass 就可以了。

https://www.npmjs.org/doc/cli/npm-update.html

Answer 3

我知道这个问题已经很老了......但这个问题实际上昨天才让我震惊

2023.12.31

。可悲的是...

grunt-contrib-sass

似乎不再维护。

通过启用

grunt --verbose

，您可以了解后台发生的情况。

Running "sass:dist" (sass) task
Verifying property sass.dist exists in config...OK
Files: src/sass/app.scss -> assets/css/app.min.css
Options: style="compressed", sourcemap="none"
Writing assets/css/app.css...OK
Command: sass src/sass/app.scss assets/css/app.min.css --style=compressed --sourcemap=none
Could not find an option named "sourcemap".

显然选项

sourcemap

不再有效...... 目前

sass

文档希望您以这种方式运行它:

sass --no-source-map style.scss style.css 我能够强制

grunt-contrib-sass

 禁用源映射，如下所示：

sass: {
  dist: {
    options: {
      style: 'compressed',
      'no-source-map': true,
    },
    files: {
      'assets/css/app.min.css': 'src/sass/app.scss',
    },
  },
},

正如您在

grunt --verbose

 输出中看到的：

Running "sass:dist" (sass) task
Verifying property sass.dist exists in config...OK
Files: src/sass/app.scss -> assets/css/app.min.css
Options: style="compressed", no-source-map
Command: sass src/sass/app.scss assets/css/app.min.css --style=compressed --no-source-map
File public/assets/css/app.min.css created

这可能是一个短期修复...只是我的两分钱...

Answer 4

添加 sourceMap: true 如下为我解决了问题（注意：我正在使用 grunt.loadNpmTasks('grunt.sass')）：

sass: {
  options: {
    includePaths: ['bower_components/foundation/scss'],
    imagePath: '/images'
  },
  dist: {
    options: {
      outputStyle: 'nested',
      sourceMap: true
    },
    files: [{
    expand: true,
            cwd: 'scss',
    src: ['[^_]*.scss'],
    dest: '../public/css/',
    ext: '.css'
    }]
  }
}

希望对某人有帮助。