NativeScript / nativescript-dev-sass

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

@import fails after upgrade to node js 7.8.0 and typescript 2.2.2 #26

Closed buksve closed 7 years ago

buksve commented 7 years ago

I have been using nativescript-sass successfully in nativescript 3.0 rc under node 7.7.3 and typescript 2.2.1. After updating to typescript 2.2.2 and node js 7.8.0, I am now getting errors at the @import statements:

Error: File to import not found or unreadable: nativescript-theme-core/scss/dark.

I have investigated a bit and it seems that if I use the full path to the include, it does successfully import the file. e.g. @import 'nativescript-theme-core/scss/dark'; does not work, while @import './node_modules/nativescript-theme-core/scss/dark'; does work.

PS. It seems the problem lies with nativescript-dev-sass@1.0.0-rc.2 Reverting to nativescript-dev-sass@1.0.0-rc.1 solves the problem.

toddanglin commented 7 years ago

This is one of the breaking changes in v1.0.0. Take a look at the README and Change Log for details.

To import files from the node_modules directory now, you must use the "~" syntax. So:

@import '~nativescript-theme-core/scss/dark`;

This change improves the compatibility of the plugin with webpack and the Angular CLI, and allows predictable relative path support for all imports. If you update to the latest release version of this plugin, just add the tilde and you should be set.

buksve commented 7 years ago

Yes I have tried the tilde but it does not make any difference:

This is installed:

d:\Projects\NativeScript\native3
`-- nativescript-dev-sass@1.0.0-rc.2
  `-- node-sass@4.5.2
    `-- request@2.81.0
      `-- har-validator@4.2.1
        `-- ajv@4.11.6

and this is the error I get:

Found peer node-sass
Error: File to import not found or unreadable: ~nativescript-theme-core/scss/dark.
       Parent style sheet: D:/Projects/NativeScript/native3/app/_app-common.scss
        on line 4 of app/_app-common.scss
>> @import '~nativescript-theme-core/scss/dark';
   ^

SASS compiler failed with exit code 1

This is the line of code:

@import '~nativescript-theme-core/scss/dark';

When I have a bit of time, I will try it on a clean template project and see if I get the same result.

toddanglin commented 7 years ago

Make sure you're using the latest released version (1.0.0...not one of the RC builds). If you're using the latest version, the tilde syntax should work. If you are on rc.2, that is probably the problem.

$ npm install nativescript-dev-sass --save-dev