sass - 无法使用 grunt-autoprefixer 获取 Sass Source Maps

Question

我在我的项目中使用 Grunt 0.4.5 和这些依赖项:

"grunt": "~0.4.5",
"grunt-contrib-concat": "~0.5.0",
"grunt-contrib-uglify": "~0.6.0",
"grunt-contrib-watch": "~0.6.1",
"grunt-contrib-sass": "~0.8.1"

我刚刚注意到 grunt-autoprefixer没有添加到我的 package.json 文件中。那是因为它没有 grunt-contrib 前缀吗？无论如何，当我从监视任务中删除 autoprefixer 时，Source Maps 对我有用，但是一旦我再次添加它，编译的 css 文件末尾的注释就会被删除。

这是我的自动前缀配置:

    autoprefixer: {
        options: {
            browsers: ['last 2 version', 'ie 8', 'ie 9']
        },
        single_file: {
              options: {
                // Target-specific options go here.
              },
              src: 'library/css/style.css',
              dest: 'library/css/style.css'
            },
        sourcemap: {
            options: {
                map: true
            }
        },
    },

我的 Sass 配置如下所示:

    sass: {
        dist: {
            options: {
                style: 'expanded',
                debugInfo: true,
                sourcemap: true
            },
            files: {
                'library/css/style.css': 'library/scss/style.scss'
            }
        } 
    },

这是我的监视任务:

    watch: {
        options: {
            livereload: true,
            },
        scripts: {
            files: ['library/js/*.js'],
            tasks: ['concat', 'uglify'],
            options: {
                spawn: false,
            },
        },
        css: {
            files: ['library/scss/*.scss'],
            tasks: ['sass', 'autoprefixer'],
            sourceComments: 'normal',
            options: {
                spawn: false,
            }
        },
        page: {
            files: ['*.php', '*.html']
        }
    }

老实说，我不明白为什么 autoprefixer 必须干扰源映射，我尝试使用 false 而不是 true，按照 grunt- 中的示例手动指定源映射autoprefixer repo，但无论我做什么，评论 - /*# sourceMappingURL=style.css.map */ 都从文件中删除，源映射在 chrome 中不起作用。

编辑:抱歉，我只是通过使用让它工作:

        sourcemap: {
            options: {
                map: true
            },
            src: 'library/css/style.css',
            dest: 'library/css/style.css' // -> dest/css/file.css, dest/css/file.css.map
        },

我很想知道，出于性能原因，我现在是否需要费心在 grunt-contrib-sass 配置中指定一个 sourcemap 选项？编译大约需要 2.4 秒，所以每 0.1 秒都很重要!

Answer 1

抱歉，我只是通过以下方法让它工作:

    sourcemap: {
        options: {
            map: true
        },
        src: 'library/css/style.css',
        dest: 'library/css/style.css' // -> dest/css/file.css, dest/css/file.css.map
    },

我很想知道，出于性能原因，我现在是否需要费心在 grunt-contrib-sass 配置中指定一个 sourcemap 选项？编译大约需要 2.4 秒，所以每 0.1 秒都很重要!我会做一些测试，看看，据我所知，它看起来像 source maps 现在默认由 sass 生成，所以我可能只需要在 autoprefixer 中指定它