2017-10-19 144 views
0

我想将scss添加到我的grunt文件中,所以我运行以下命令: npm install grunt-contrib-sass sass --save-dev。 然后我说下面我Gruntfile.jsgrunt将内容写入控制台而不是文件?

grunt.loadNpmTasks('grunt-contrib-sass');

grunt.initConfig({ 
... 
sass: { 
    dev: { 
     files: { 
      '<%=meta.src %>assets/css/all2.css': '<%=meta.src %>assets/scss/build.scss' 
     } 
    }, 

    dist: { 
     files: { 
      '<%=meta.dist %>/assets/css/all.min.css': '<%=meta.src %>/assets/scss/build.scss' 
     } 
    } 
}, 

当我运行此我得到的build.scss的输出在控制台,它创建了一个空文件?

我在想什么?

Running "sass:dev" (sass) task 
#flupdidup { 
    font-weight: bold; 
} 
Running "sass:dist" (sass) task 
#flupdidup { 
    font-weight: bold; 
} 
Done, without errors. 
Process terminated with code 0. 

问题的最小娱乐可以在这里找到:https://github.com/Peter-Optiway/grunt-sass-issue

+1

你可以删除'<%= meta.src%>',看看它的工作原理精细? –

+0

@TarunLalwani可悲的是,没有改变任何东西'./app/assets/css/all2.css':'。/ app/assets/scss/build.scss'' – Peter

+1

可能得到一个最小的git repo进行调试? –

回答

0

我设法通过更改为grunt-sass包而不是解决问题。

npm install --save-dev load-grunt-tasks load-grunt-tasks 然后我添加以下内容到我的Gruntfile.jsrequire('load-grunt-tasks')(grunt);,它刚刚工作。

+0

看看我发布的答案 –

3

切换到grunt-sass总是一个选项,但您的问题不是因为这一点。这个问题是因为你使用npm安装了sass

npm install -g sass 

当你看那个

$ sass --help 
Compile Sass to CSS. 

Usage: dart-sass <input> 

-s, --style   Output style. 
        [expanded (default)] 

-c, --[no-]color Whether to emit terminal colors. 
    --[no-]trace Print full Dart stack traces for exceptions. 
-h, --help   Print this usage information. 
    --version  Print the version of Dart Sass. 

它没有输出参数。虽然grunt-contrib-sass预计Sass从红宝石安装。

$ sudo gem install sass 

现在青菜都会有不同的选择

$ sass --help 
Usage: sass [options] [INPUT] [OUTPUT] 

Description: 
    Converts SCSS or Sass files to CSS. 
... 

现在构建工作正常

$ cat ./dist/assets/css/all.min.css 
main #flupdidup { 
    font-weight: bold; 
    background: #eeffcc; } 

/*# sourceMappingURL=all.min.css.map */ 
+0

最后'grunt-sass'是一个更好的选择,因为它不依赖于ruby,但是你可以得到50分! – Peter