在Laravel Elixir中由gulp编译的scss文件中使用指南针mixins

时间:2016-02-06 09:11:52

标签: laravel sass gulp compass-sass compass

我想在scss文件中使用Compass mixins和Capabilities,这些文件应该使用 laravel Elixir 中的 Gulp 任务进行编译。

例如,我在my-styles.css目录中有两个名为app.scssresource/assets/sass的scss文件:

这是my-styles.scss档案:

@import "compass/css3";
body{
      opacity: 1.0;
      animation: test;
      color: red;
      text-align: center;
      a:link{
        background-color: red;
        text-decoration: none ;
        &.span{
          color: red;
          @include border-radius(5px);
        }
      }

} 

这是app.scss文件内容:

a{
  transform: scale(1.1);
  transform: rotate(30deg) scale(10);
}

要编译这个scss文件并将它们组合到all.css目录中的文件名public/css,我写这个:

var elixir  = require('laravel-elixir');
var gulp    = require('gulp');
var compass = require('gulp-compass');
var sass    = require('gulp-sass');

gulp.task('compile', function () {
    return gulp
        .src(['my-styles.scss', 'app.scss'])
        .pipe(sass({compass: true, sourcemap: true, style: 'compressed'}))
        .pipe(gulp.dest('public/css/all.css'));
});

elixir.config.sourcemaps = false;
elixir(function (mix) {
    mix.task('compile');
});

在控制台中运行gulp命令后,会显示以下消息:

D:\wamp\www\newProject>gulp
[12:36:48] Using gulpfile D:\wamp\www\newProject\gulpfile.js
[12:36:48] Starting 'default'...
[12:36:48] Starting 'task'...
[12:36:48] Starting 'compile'...
[12:36:48] Finished 'task' after 17 ms
[12:36:48] Finished 'default' after 21 ms
[12:36:48] Finished 'compile' after 26 ms

但是public目录中没有创建文件。

什么是问题?

0 个答案:

没有答案