Angular Dart - Использование sass-файлов - PullRequest
Новая
       12

Angular Dart - Использование sass-файлов

0 голосов
/ 18 сентября 2018

Я пытаюсь настроить sass с Angular Dart, но я немного растерялся и не смог найти документацию за 2016 год (хорошую)

В настоящее время у меня есть следующая структура:

structure

Однако я не могу ссылаться на файл main.css, так как он не найден, и если в компоненте я добавлю что-то вроде этого styleUrls: ['lib/assets/sass/main.scss']

Сбой команды webdev serve

Мой pubscpec - 

dependencies:
  angular: ^5.0.0
  angular_components: ^0.9.0
  bootstrap_sass: any

dev_dependencies:
  angular_test: ^2.0.0
  sass_builder: ^2.1.1
  build_runner: ^0.10.0
  build_test: ^0.10.2
  build_web_compilers: ^0.4.0
  mockito: ^3.0.0
  test: ^1.3.2

Я не могу понять, что не так, а также структуру, которую я должен использовать

Должен ли я добавить свой верхний компонентmain.scss (или компилятор main.css) и не устанавливать никаких других ссылок на файлы, или я должен включать их в каждый компонент?А также, как я могу сгенерировать этот скомпилированный файл при запуске webdev serve

Спасибо, Alexi

1 Ответ

0 голосов
/ 19 сентября 2018

Таким образом, ссылки на styleUrls всегда должны быть скомпилированным css, а не файлом Sass.Также URL должны быть либо относительно файла, либо формата пакета.Так что либо 'main.css' или 'package: your_project / assets / sass / main.css'

Я бы также предложил не иметь отдельных каталогов ресурсов.Я склонен находить, что файл sass рядом с компонентом проще поддерживать.

AngularDart также имеет инкапсуляцию стиля по умолчанию;это означает, что CSS не будет вытекать из компонентов по умолчанию.Учитывая это, я считаю, что лучше иметь CSS локально для этого компонента и быть рядом с этим компонентом.Вы увидите, что это шаблон на угловых компонентах и ​​галерея.

Одна небольшая заметка о компонентах и ​​галерея.Они используют шаблон style.scss.css вместо style.css, который нарушает соглашение Sass.Это объясняется тем, что мы можем быстро определить источник CSS-файла.Было ли это написано от руки или Sass.Это достигается с помощью различных настроек в файле build.yaml.Я не думаю, что вы должны делать это для своего проекта, хотя.

...