Skip to content

Feature: Allow loading .css files as a fallback if no .scss file is found #954

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
vakrilov opened this issue Aug 22, 2017 · 0 comments
Closed
Assignees
Labels
Milestone

Comments

@vakrilov
Copy link
Contributor

The goal is be able to use SASS for styling components in development(without webpack and AOT) and for production(with webpack/AOT) with the following syntax:

@Component({
    //...
    styleUrls: ["./my-component.scss"]
})
export class MyComponent { ... }

With Webpack/AOT

Assuming you are using the nativescript-dev-webpack {N} plugin and and the @ngtools/webpack webpack plugin.
The .scss files will be compiled and bundled by the webpack build - so no changes are required as long as you have the webpack configured to handle .scss files

Without Webpack/AOT

The .scss files will be compiled by the nativescript-dev-sass plugin in a before-prepare. This will generate my-component.css file. However, we need to be able to load the compiled .css file runtime, when the my-component.scss is requested by angular runtime compiler.
Note: The nativescript-dev-sass plugin should clear all .scss so that they are not availabe in the app.

Solution

Make changes in the FileSystemResourceLoader so that it fallbacks to loading .css file, if a .scss file was requested and not found.

@vakrilov vakrilov changed the title Allow loading .css files as a fallback Feat: Allow loading .css files as a fallback Aug 22, 2017
@vakrilov vakrilov changed the title Feat: Allow loading .css files as a fallback Feature: Allow loading .css files as a fallback Aug 22, 2017
@vakrilov vakrilov changed the title Feature: Allow loading .css files as a fallback Feature: Allow loading .css files as a fallback to .scss Aug 22, 2017
@vakrilov vakrilov changed the title Feature: Allow loading .css files as a fallback to .scss Feature: Allow loading .css files as a fallback if no .scss file is found Aug 22, 2017
@vakrilov vakrilov self-assigned this Aug 22, 2017
@vakrilov vakrilov added this to the 4.3 milestone Aug 22, 2017
vakrilov pushed a commit that referenced this issue Aug 30, 2017
…e is found(#954) (#955)

* feat(styling): Allow loading .css files as a fallback if no .scss file is found(#954)

* Add tests

* refactor: resource loader (#968)

* chore(lint): use 4 spaces instead of 2 in ns-file-system

* refactor: resource loader

* test(xhr-paths): assert resource loader throws when resolving non-existing files
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

1 participant