Как добавить компиляцию Sass в Angular CLI 6: angular.в JSON?

я только что создал новый угловой проект, используя новый угловой CLI 6.0, но мне нужно добавить компиляцию Sass в мой проект. Я знаю, что вы можете установить флаг при создании проекта, но мой проект уже создан и работа была выполнена.



новый файл конфигурации, который генерируется с новым угловым CLI, теперь называется angular.json, а не angular-cli.json. Схема для файла также отличается, с новыми свойствами.



старого angular-cli.json есть раздел, где вы можете установить stylExt вот так,



"defaults": {

    "styleExt": "scss"

}


но я не уверен, где именно поставить эту, так как после "test" и "lint" свойства, дает Линт ошибка:



Matches multiple schemas when only one must validate.



и здание производит:



Schema validation failed with the following errors:
Data path "['defaults']" should NOT have additional properties(styleExt).



смотрим документы CLI я не вижу ничего, что указывало бы, где поставить "styleExt".



я видел другие ответы, советуя: ng set defaults.styleExt scss что бросаетget/set have been deprecated in favor of the config command..



пробовал ng config set defaults.styleExt scss и npm config set defaults.styleExt scss при первом выбрасывании ошибки, а последний, по-видимому, не влияет на файл, но без ошибок.

820   2  

2 ответов:

делать именно то, что Смоки Доусон прокомментировал,

"projects": {
  "angular-app": {
    "root": "",
    "sourceRoot": "src",
    "projectType": "application",
    "prefix": "app",
    "schematics": {
      "@schematics/angular:component": {
        "styleext": "scss"
      }
    },
    "architect": {...}
  }
}

выше результат. Так что в вашем приложении, под ключ schematics, добавить ключ @schematics/angular:component с ключом styleext значение scss.

это должно быть применено к вашей angular.json файл в корневом каталоге вашего проекта.

81  
2018-07-25 08:37:09

в угловой 6, это проще, чем это. Компиляция обрабатывается автоматически! Как это ? Использовать scss на уровне компонентов вам нужно назвать файл с расширением scss (то же самое для меньше, стиль). И в вашем компонент.ТС изменить соответствующий стиль scss тоже.

вот скриншот из документа: enter image description here

и использовать Scss в глобальном масштабе (src / styles.css), то вам нужно изменить стили.CSS для стилей.scss (то же самое идет меньше, стиль ...прием.) И тогда вы идете на угловой.json и изменить старые стили.CSS для новых стилей.стоимость СКС. Как показано на рисунке ниже:

enter image description here

здесь ссылка на документ для первой части для тех, кто хочет исследовать себя: https://angular.io/guide/component-styles#non-css-style-files

теперь насчет настройка, ng-cli поэтому при создании нового компонента расширение будет по умолчанию scss ? Используйте следующим образом:

 ng config schematics.@schematics/angular:component.styleext scss

это будет обновить угловой.json с:

"schematics": {
    "@schematics/angular:component": {
        "styleext": "scss"
    }
}

, который является эквивалентным старому угловые-Кинк.json 

    defaults: {
        "styleext": "scss"
    }

это для проекта, который уже запущен, но не установлен по умолчанию для scss. Если вы создаете новый проект, то используйте опцию --style, чтобы указать, что, как следуйте:

ng new my-project --style=scss

и вам не придется использовать прецедентную команду, которая является командой конфигурации, которая позволяет нам обновить указанное поле в угловом.JSON-файл (потому что это будет уже установлен).

20  
2018-08-26 20:45:00

Comments

    Ничего не найдено.
Click here to cancel reply.