NativeScript / nativescript-dev-webpack

A package to help with webpacking NativeScript apps.
Apache License 2.0
97 stars 49 forks source link

css2json-loader and export #1120

Open farfromrefug opened 4 years ago

farfromrefug commented 4 years ago

In my app i do something like this is sass

$primary-color: #2196F3;
:export {
    primaryColor: $primary-color;
  }

The idea is to be able to require within javascript like this

import { locals } from '~/variables.scss';
export const primaryColor: string = locals.primaryColor;

Now primaryColor is available everywhere.

However this works when i use css-loader but not when i use nativescript-dev-webpack/css2json-loader. Do you have any idea on how i can make it work

edusperoni commented 4 years ago

This is my solution (I'm using the older version but it'll work with css2json-loader):

                // add /\.module\.scss$/i to exclude!
                { test: /\.scss$/, exclude: [/[\/|\\]app\.scss$/, /\.module\.scss$/i], use: ["raw-loader", "resolve-url-loader", "sass-loader"] },
                {
                    test: /\.module\.scss$/i, use: [
                        {
                        loader: "css-loader",
                        options: {
                            url: false
                        }
                    }, "sass-loader"]
                },

We create my.module.scss with:

@import "../../app-variables";

:export {
    accent: $accent-dark;
}

If anyone knows of a better solution, it'd be nice!

farfromrefug commented 4 years ago

@edusperoni i see will try! thanks