Grunt sass @import 没有制作 css答案

【问题标题】：Grunt sass @import not making cssGrunt sass @import 没有制作 css
【发布时间】：2016-02-19 02:10:12
【问题描述】：

我正在尝试将 sass 与 grunt 一起使用，但我的行为很奇怪。如果我创建任何带下划线的文件，它将不再起作用，并且也不会导入。

那是我的 Gruntfile，真的很简单：

module.exports = function(grunt) {
    'use strict';

    require('load-grunt-tasks')(grunt);

    grunt.initConfig({
        watch: {
            sass: {
                files: 'scss/**/*.{scss,sass}',
                tasks: ['sass']
            }
        },
        sass: {
            example: {
                options: {
                    outputStyle: 'expanded'
                },
                files: {
                    'public/css/app.css': 'scss/**/*.{scss,sass}'
                }
            }
        }
    });

    grunt.registerTask('default', ['watch']);
};

如果我在scss/ 中创建一个文件，例如application.scss，它会工作并在public/css 中创建文件app.css，但是如果我创建任何带下划线的文件，例如：_variables 在scss/ 它不再工作了，它不会创建文件或更改任何内容，也不会导入。

application.scss：

@import "variables";

body {
    background-color: $bg-color;
}

_variables.scss：

$bg-color: red;

【问题讨论】：

标签： sass gruntjs

【解决方案1】：

名称以下划线开头的文件在 SASS 眼中被视为部分文件。这意味着 SASS 不会用它们制作实际的 css 文件。为防止这种情况，请创建一个 index.scss 文件并将您的部分导入其中，或者从其名称中删除下划线。

Official DOcs

【讨论】：

我做了，我尝试导入，但无论如何都不起作用。 application.scss 是主文件，问题是，如果我在该文件夹中创建任何带有下划线的文件，它就不再起作用了，即使它只是要被导入。
我编辑了这个问题。在那里你会看到我是如何尝试导入的。
它不起作用，只有当我从文件夹中删除_variables 文件时它才起作用。
这个答案是正确的，但是您还需要将'public/css/app.css': 'scss/**/*.{scss,sass}' 更改为'public/css/app.css': 'scss/index.scss' 并在 index.scss 中引用您的其他 sass 文件，这样 grunt-sass 将处理来自该文件的 sass，该文件导入所有其他部分。
@suzumakes - 这样做我将无法创建其他文件，我将监视所有文件，但只编译一个，如果我必须创建其他文件，例如：gallery.scss？

【解决方案2】：

我解决了这个问题：

files: [{
    expand: true,
    cwd: 'scss',
    src: '**/*.{scss,sass}',
    dest: 'public/css',
    ext: '.css'
}]

【讨论】：