Проблемы с Sass при использовании генератора angular-fullstack

Я настроил веб-приложение с использованием Sass с генератором полного стека Angular от Yeoman. Казалось, что все работает нормально, пока я не понял, что ошибки выводятся каждый раз, когда grunt пытается запустить задачу. Вот результат:

/Users/rorysmith/.rvm/rubies/ruby-2.2.1/bin/scss --no-cache --update app.scss:app.css
error app.scss (Line 4: File to import not found or unreadable: ../bower_components/bootstrap-sass-official/vendor/assets/fonts/bootstrap.)

Process finished with exit code 1

Это относится к строке в app.scss файле:

@import '../bower_components/bootstrap-sass-official/vendor/assets/fonts/bootstrap'

Я изменил каталог, включив вначале ../, так как здесь находится мой bower_components:

папки

При закомментировании возникает проблема с другой строкой того же файла: @import 'modal/modal.scss';

Вот файл app.scss целиком, это просто стандартный файл, созданный генератором:

$icon-font-path: "../bower_components/bootstrap-sass-official/vendor/assets/fonts/bootstrap";
$fa-font-path: "../bower_components/font-awesome/fonts";

@import '../bower_components/bootstrap-sass-official/vendor/assets/fonts/bootstrap';
@import '../bower_components/font-awesome/fonts';

/**
 * App-wide Styles
 */

.browsehappy {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}

// Component styles are injected through grunt
// injector
@import 'account/login/login.scss';
@import 'admin/admin.scss';
@import 'create/create.scss';
@import 'main/main.scss';
@import 'modal/modal.scss';
// endinjector

Есть идеи, что происходит на земле?


person alanbuchanan    schedule 15.10.2015    source источник


Ответы (1)


У меня была такая же проблема, вот что "исправило" для меня ...

В Gruntfile найдите следующее:

  // Inject component scss into app.scss
  sass: {
    options: {
      transform: function(filePath) {
        filePath = filePath.replace('/client/app/', '');
        filePath = filePath.replace('/client/components/', '');
        return '@import \'' + filePath + '\';';
      },
      starttag: '// injector',
      endtag: '// endinjector'
    },
    files: {
      '<%= yeoman.client %>/app/app.scss': [
        '<%= yeoman.client %>/{app,components}/**/*.{scss,sass}',
        '!<%= yeoman.client %>/app/app.{scss,sass}'
      ]
    }
  },

Измените следующую строку, чтобы она читалась:

filePath = filePath.replace('/client/components/', '../components/');

Теперь он должен вводить правильные пути.

Предостережение: я действительно не знаю, что делаю.

person thewils    schedule 01.11.2015