From 2c0a36e98d225f07eeb5a46ee564004e6d7feb86 Mon Sep 17 00:00:00 2001
From: fatme <hfatme@gmail.com>
Date: Thu, 21 Nov 2019 16:30:35 +0200
Subject: [PATCH] fix: fix module import of local css files

There is an issue when importing local css file as module as the `css2json-loader` handles it as a module instead of a local file. So, the webpack throws an error that it is not able to find the module. This PR fixes this issue as changing the method used to get the correct file uri with the method used by `css-loader` itself - https://github.com/webpack-contrib/css-loader/blob/967fb66da2545f04055eb0900a69f86e484dd842/src/utils.js#L220.

Rel to: https://github.com/NativeScript/nativescript-dev-webpack/issues/1098
---
 css2json-loader.spec.ts | 4 ++--
 css2json-loader.ts      | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/css2json-loader.spec.ts b/css2json-loader.spec.ts
index 76ce79e3..b5229cd8 100644
--- a/css2json-loader.spec.ts
+++ b/css2json-loader.spec.ts
@@ -38,7 +38,7 @@ describe("css2jsonLoader", () => {
 
             const loaderContext = {
                 callback: (error, source: string, map) => {
-                    expect(source).toContain(`global.registerModule("custom.css", () => require("custom.css"))`);
+                    expect(source).toContain(`global.registerModule("./custom.css", () => require("./custom.css"))`);
                     expect(source).toContain(`{"type":"declaration","property":"background-color","value":"#7f9"}`);
 
                     done();
@@ -52,7 +52,7 @@ describe("css2jsonLoader", () => {
     it("inlines css2json loader in imports if option is provided", (done) => {
         const loaderContext = {
             callback: (error, source: string, map) => {
-                expect(source).toContain(`global.registerModule("custom.css", () => require("!nativescript-dev-webpack/css2json-loader?useForImports!custom.css"))`);
+                expect(source).toContain(`global.registerModule("./custom.css", () => require("!nativescript-dev-webpack/css2json-loader?useForImports!./custom.css"))`);
                 expect(source).toContain(`{"type":"declaration","property":"background-color","value":"#7f9"}`);
 
                 done();
diff --git a/css2json-loader.ts b/css2json-loader.ts
index 545e349c..19f75bfa 100644
--- a/css2json-loader.ts
+++ b/css2json-loader.ts
@@ -1,6 +1,6 @@
 import { parse, Import, Stylesheet } from "css";
 import { loader } from "webpack";
-import { getOptions } from "loader-utils";
+import { getOptions, urlToRequest } from "loader-utils";
 
 const betweenQuotesPattern = /('|")(.*?)\1/;
 const unpackUrlPattern = /url\(([^\)]+)\)/;
@@ -53,7 +53,7 @@ function extractUrlFromRule(importRule: Import): string {
 function createRequireUri(uri): { uri: string, requireURI: string } {
     return {
         uri: uri,
-        requireURI: uri[0] === "~" && uri[1] !== "/" ? uri.substr(1) : uri
+        requireURI: urlToRequest(uri)
     };
 }