Я не могу использовать стили css на своей панели навигации (используя sass)

#css #sass

Вопрос:

Я начинаю учиться самостоятельно, и я впервые попытался использовать sass, чтобы более очистить свой код, имея все в разделах. Итак, проблема в том, что когда я пытаюсь придать некоторые стили навигационной панели, я не знаю, почему, когда я пишу код, он не применяется. Может быть, это потому, что я неправильно связываю или просто плохо использую компилятор sass.

Лучший вариант помочь мне-заглянуть в мой репозиторий, где я начал создавать этот проект для практики. Я действительно надеюсь, что это может помочь мне, потому что я хочу создавать различные разделы, такие как панель навигации, текст, статьи, нижний колонтитул, используя sass, и придавать им стили.

https://github.com/Shylex96/test-portfolio

Редактировать: После долгого поиска по этой проблеме я вижу, что есть проблема с «использованием», и мне нужно изменить правила или что-то в этом роде, но все еще не знаю.

Комментарии:

1. Я бы посмотрел, как вы импортируете его в свой HTML. « <!—Заголовок и логотип, ссылка CSS —> <!—Заголовок и логотип, ссылка CSS —><ссылка rel=»значок быстрого доступа» тип=»изображение/png» href=»#» /> <ссылка rel=»значок быстрого доступа» тип=»изображение/png» href=»#» /><ссылка rel=»таблица стилей» тип=»текст/css» href=»/dist/style.css»> <ссылка rel=»таблица стилей» тип=»текст/css» href=»/dist/style.css»><название>Портфолио — Веб-сайт Desarrollador<название></название>« Также сам стиль.css.

2. Привет, я просто изменил его с: <ссылка rel=»таблица стилей» тип=»текст/css» href=»/dist/style.css»> на это: <ссылка rel=»таблица стилей» тип=»текст/css» href=»/dist/style.css»><ссылка rel=»таблица стилей» тип=»текст/css» href=»стиль.css»> но, похоже, все еще не применяется

3. Это то, как вы компилируете свою дерзость (которая может быть чем угодно). Если вы посмотрите в своем styles.css , у вас есть два @use утверждения, которые не будут прочитаны браузером. В основном все ваши SCSS должны компилироваться в файл style.css, но это не так.

4. Да, я видел две ошибки «@use», но там написано «Неизвестно в правиле @use css(неизвестные правила)». Как вы сказали, что-то, из-за чего он не компилируется.. Я буду продолжать смотреть и наберусь терпения, если кто-нибудь сможет сказать мне, что происходит. Спасибо за помощь.

Ответ №1:

Замените @use на @import в ваших файлах scss.

Попробуйте обновить свой utilstyle.scss, как показано ниже:

 @import '../globals/';
@import '../components/';
 

Сохраните и скомпилируйте их, а затем скопируйте полученные css-файлы в папку dist, если они не были скопированы автоматически.

Обновите ссылку на таблицу стилей в своем index.html файл в:

 <link rel="stylesheet" type="text/css" href="dist/style.css">
 

Это должно быть «dist/style.css», а не «/dist/style.css».

Комментарии:

1. Ну, я сделал все, кроме еще одной ошибки при компиляции: Ошибка компиляции Ошибка: EISDIR: незаконная операция с каталогом, прочитанная в строке 1 sass/c:ПользователиShylexДокументыGitHubтест-портфолиоприложениеscssutilstyle.scss >>> @импорт ‘../глобалы/’;

Ответ №2:

НАКОНЕЦ-ТО!! Я решил эту проблему и собираюсь сделать то, что поможет мне, если у кого-то возникнут такие же проблемы..

Мне пришлось переустановить node.js, установите gulp и измените «about_Execution_Policies» в Windows.. когда я это сделал, я смог, наконец, правильно установить gulp, а затем снова установить sass. Конечно, я просто преобразовал все изменения, о которых мне говорили люди, в первые, которые у меня были. Я создал новый файл под названием gulpfie.js и еще два файла: .gitignore и .gitattributes

Так что, если кому-то это нужно, можете проверить изменения здесь: https://github.com/Shylex96/test-portfolio

Комментарии:

1. Кстати. Мне пришлось удалить файл style.scss из папки «util»