Как использовать less & bootstrap в проекте angular 6? - PullRequest
Новая
       11

Как использовать less & bootstrap в проекте angular 6?

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

Я должен отредактировать текст стиля angular.json, чтобы использовать меньше 

"schematics": {
    "@schematics/angular:component": {
      "prefix": "app",
      "styleext": "less"
    },
    "@schematics/angular:directive": {
      "prefix": "app"
    }
  }

Я создаю компонент и проверяю, чем меньше он работает. Но теперь я хочу смешать компонент css / less с классами bootgstrap.

Например, я хочу, чтобы все кнопки в моем компоненте имели .mx-1

Я набираю меньше: 

.btnmx-1{
   .btn();
   .mx-1();
}

но это не удалось. Я пытался импортировать: 

 @import "../../../../node_modules/bootstrap/dist/css/bootstrap.min.css";

.btnmx-1{
   .btn();
   .mx-1();
}

этот файл также не удалось скомпилировать с ошибкой: .btn не определен

Как это исправить? Я хочу, чтобы все кнопки в моем компоненте имели отступ слева и справа от 1px, унаследованный от начальной загрузки

1 Ответ

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

Для Bootsrap : 

npm install bootsrap --save

in angular.json: 

  "styles": [
              "node_modules/bootstrap/dist/css/bootstrap.css",
              "src/styles.scss"
            ],

Для меньше :

добавить less тип файла вместо css (по умолчанию) 

comp.component.less

в angular.json.

Установите для свойства defaults.styleExt значение less.

...