Question

我需要在Lumen项目中设置sass，来自厨房水槽中的sass。这是我第一次设置它，所以我想知道如何为它设置gulpfile.js？

我已经通过运行npm install安装了node_modules，并且我还安装了laravel elixir。

我的文件夹/文件结构如下所示：

resources/assets/img
                /js/app.js
                /sass/_settings.scss
                      app.scss

我的gulpfile.js看起来像这样：

var elixir = require('laravel-elixir');

/*
 |--------------------------------------------------------------------------
 | Elixir Asset Management
 |--------------------------------------------------------------------------
 |
 | Elixir provides a clean, fluent API for defining some basic Gulp tasks
 | for your Laravel application. By default, we are compiling the Sass
 | file for our application, as well as publishing vendor resources.
 |
 */

elixir(function(mix) {
    mix.sass('app.scss');
});

但是当我运行gulp时，我得到所有导入的错误并包含在我的scss文件中：

这就是我的scss文件的样子：

app.scss

@import "settings";
@import "foundation";
@import "motion-ui";

@include foundation-flex-grid;
@include foundation-global-styles;
@include foundation-typography;
@include foundation-button;
@include foundation-forms;
@include foundation-visibility-classes;
@include foundation-float-classes;
@include foundation-flex-classes;
// @include foundation-accordion;
// @include foundation-accordion-menu;
// @include foundation-badge;
// @include foundation-breadcrumbs;
// @include foundation-button-group;
// @include foundation-callout;
// @include foundation-close-button;
// @include foundation-drilldown-menu;
// @include foundation-dropdown;
// @include foundation-dropdown-menu;
// @include foundation-flex-video;
// @include foundation-label;
// @include foundation-media-object;
// @include foundation-menu;
// @include foundation-off-canvas;
// @include foundation-orbit;
// @include foundation-pagination;
// @include foundation-progress-bar;
// @include foundation-slider;
// @include foundation-sticky;
// @include foundation-reveal;
// @include foundation-switch;
// @include foundation-table;
// @include foundation-tabs;
// @include foundation-thumbnail;
// @include foundation-title-bar;
// @include foundation-tooltip;
// @include foundation-top-bar;

@include motion-ui-transitions;
@include motion-ui-animations;

我的_setttings.scss有这一行，我得到一个错误：

@import 'util/util';

错误：

{[错误：resources / assets / sass / _settings.scss错误：要导入的文件   找不到或不可读：util / util          父样式表：/Users/markodraksic/Projects/Quiz-landing-page/resources/assets/sass/_settings.scss           在资源/资产/ sass / _settings.scss
的第42行


@import＆＃39; util / util＆＃39;;

Answer 1

我重现了您的错误并找到了解决方案here。

您可以尝试将包复制到资源中。

将复制方法添加到gulpfile：

elixir(function(mix) {
    mix.copy('node_modules/foundation-sites/scss', 'resources/assets/sass') 
       .sass('app.scss');
});

另一个选择是添加一个包含路径（我无法工作）。

Lumen / Elixir - 未找到或无法读取导入的文件

1 个答案: