Как добавить Pico CSS в глобальную таблицу стилей scss в Angular 17?
Я только что создал новый проект Angular 17 с SCSS в качестве формата таблицы стилей и хочу использовать Pico CSS в своем проекте.
В документации Pico CSS мне сказано сделать это следующим образом:
Сначала установите Pico CSS.
npm install @picocss/pico
Затем импортируйте его в свой файл SCSS с помощью @use.
@use "pico";
Однако это дает мне следующую ошибку:
✘ [ERROR] Can't find stylesheet to import.
╷
3 │ @use "pico";
│ ^^^^^^^^^^^
╵
src/styles.scss 3:1 root stylesheet [plugin angular-sass]
angular:styles/global:styles:1:8:
1 │ @import 'src/styles.scss';
╵ ~~~~~~~~~~~~~~~~~
Как правильно добавить Pico CSS в мой глобальный styles.scss в Angular?
Ответы 1
Вместо @use "pico" поставьте @use "@picocss/pico/scss" в styles.scss.
/* styles.scss */
@use "@picocss/pico/scss";
Можете ли вы рассказать подробности о том, как это не работает?
Ошибка выглядит следующим образом: src\styles\styles.scss:1:1: Невозможно найти таблицу стилей для импорта. ╷ 1 │ используйте «picocss/pico/scss»; │ ^^^^^^^^^^^^^^^^^^^^^^^^^ ╵ src\styles\styles.scss 1:1 корневая таблица стилей Ошибка: не удается найти таблицу стилей для импорта. ╷ 1 │ используйте «picocss/pico/scss»; │ ^^^^^^^^^^^^^^^^^^^^^^^^^ ╵ src\styles\styles.scss корневая таблица стилей 1:1 Но я нашел уродливое, но работающее решение на github
PS: Я удалил символы at, потому что не мог оставить с ними комментарий.
Рад, что вы нашли решение, которое подойдет вам. Какая у вас версия Angular? На Angular 17 все работает нормально. Протестировал это на проекте Angular 15, и это тоже сработало.
Это автономный проект без какой-либо библиотеки, кроме пакета.
это решение также не работает