week 5 – Can’t find stylesheet to import. Problems with Angular Material

After 2 really fruitful weeks, in the last one I didn’t have much time to work on the project, because I have some more important things to tackle. To make matters worse, I spent most of the time struggling with one problem, which in the end was bit a big deal 😑. In simple words, I still see the error in the output, but everything works fine. I spent 7 hours chasing the issue that doesn’t exist (more on that in the ‘impediments’ section below).
The good news is I spent some time learning Angular Material and was almost done rewriting one of the components.

what did I do last week?

🔶installed Angular Material
🔶learned about Angular Material components
🔶rewrite one component using Angular Material:

what was the biggest impediment?

In previous weeks, while working on UI, I installed a Visual Studio Code extension called: Live Sass Compiler. As the name suggests, it compiles the .scss files to .css at runtime and lets you see the changes in .scss immediately. I had no problems with this extension until I installed Angular Material. After installation, I started getting the following message after saving the styles.scss file generated by Angular.

As I mentioned, I have spent hours searching for what might be wrong. I reinstalled the Sass plugin and Angular Material a few times but it didn’t fix the issue. So I just tried configuring Angular Material according to the official documentation from https://material.angular.io and found everything working as it should 🤷. I think this bug might be because this Sass compiler doesn’t fully support the latest Angular version (14), but I don’t want to spend any more time on it as I see that has no impact on the Angular Material features.

UPDATE:
I realized that the above error blocked me from using css variables, but finally fixed it by installing sass and updating Angular libraries:

what is the plan for next week?

  • finish the rewriting of the remaining components
  • add modal with explanation after the wrong answer

time spent

  • from last week
    9h 30m
  • overall
    59h 0m

costs

  • from last week
    0 $
  • overall
    32 $

summary

It’s been one of the most annoying weeks, but I’m glad that Material toolkit is finally working. Hope to get more work done this week 🙏.

Related Posts

Leave a Reply

Your email address will not be published.