search

NativeScript / nativescript-dev-sass

SASS CSS pre-processor for NativeScript projects
Apache License 2.0
44 stars 17 forks source link

Sass in NativeScript with angular for Component specific .scss #36

Closed umeshswamy closed 6 years ago

umeshswamy commented 7 years ago

I am trying to use nativescript-dev-sass plugin and it successfully creates ".css" files from within the app folder only (NOT Subfolders) in my project (app.scss -> app.css). But I want to use component specific css file. That is, inside "app" folder I have component folder "login" and it contains login.scss. (app -> login -> login.scss). The login.css is not getting generated.

Is it not possible to use it like this ? Should I add all my css into "app" folder and set the path to css right in all the components that I create ? Please help.

philliptmaddox commented 7 years ago

I am having the same issue. The plugin only appears to watch the app root so you'll have to compile there. So far the Native Script file tree is a real mess between this and all the compiled files.

zbranzov commented 6 years ago

Do you follow the guide here https://docs.nativescript.org/ui/theme#using-custom-scss-file ? I made a brand new app from ng template and when I add a custom scss for the items in my list everything works. Notice that they are in app/item folder. I'm using latest versions of tns and nativescript-dev-sass Can you provide a sample app that reproduces the case if it's still relevant?

ikhsan017 commented 6 years ago

I have the same issue, it sometimes compiled but sometimes its not

progand commented 6 years ago

Same problem I had. But I found solution here https://github.com/NativeScript/nativescript-dev-sass/issues/57

@ikhsan017 @umeshrs any chances you've upgraded nodejs recently? Try this:

  1. npm rebuild node-sass --force
  2. delete node_modules
  3. Remove platform tns platform remove android or tns platform remove ios
  4. Add platform again tns add platform ...

But every time I add new .scss file within component I have this problem in development mode again so I run build to make it work tns build android

zbranzov commented 6 years ago

Can you try to reproduce the issue with the latest v1.5.0 that utilizes chokidar watcher? What I did and worked for me:

  1. Created new app "tns create ngApp --ng"
  2. Added custom scss as described at https://docs.nativescript.org/ui/theme#using-custom-scss-file in items folder for items.component.html.
  3. When changed the scss was properly reflected in the app.
luma7 commented 6 years ago

Did have the same problem, and was solved with 1.5.0. Great work!

MGalatioto commented 5 years ago

Hi! I made evertyhing as descriped here https://docs.nativescript.org/ui/theme#using-custom-scss-file and it is still not working.

See following path-config (also styleUrls) image

Unfortunaetly, it still takes my styiling of _app-common - what am I doing wrong? Appreciate any Help!