From 59055fedaf01bf97620a421f771398bbcd0fdd0a Mon Sep 17 00:00:00 2001
From: Constantine Genchevsky <const.gen@gmail.com>
Date: Mon, 17 Aug 2020 12:08:42 +0300
Subject: [PATCH 1/3] Consider styles loaded from Vue component

Add integration with vue-laoder
---
 index.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/index.js b/index.js
index 60541a3..4e3352b 100644
--- a/index.js
+++ b/index.js
@@ -109,11 +109,11 @@ const operator = {
         const preProcs = [
             {
                 type: 'sass',
-                reg: /\.scss$|\.sass$/
+                reg: /\.scss$|\.sass$|\.vue\?.*?lang=scss|\.vue\?.*?lang=sass/
             },
             {
                 type: 'less',
-                reg: /\.less$/
+                reg: /\.less$|\.vue\?.*?lang=less/
             }
         ];
 

From bfee215a042dfa91c03d1cb4500e1b40408a047a Mon Sep 17 00:00:00 2001
From: constgen <const.gen@gmail.com>
Date: Sun, 28 Feb 2021 18:02:01 +0200
Subject: [PATCH 2/3] Add tests for styles in Vue components

---
 __tests__/index.spec.js | 19 +++++++++++++++++++
 1 file changed, 19 insertions(+)

diff --git a/__tests__/index.spec.js b/__tests__/index.spec.js
index 8735117..b20a8ba 100644
--- a/__tests__/index.spec.js
+++ b/__tests__/index.spec.js
@@ -257,10 +257,29 @@ describe('js-to-styles-vars-loader', () => {
             expect(operator.getPreprocessorType({ resource: '/path/to/resource.sass'})).toEqual('sass');
         });
 
+        it('should recognise sass resource in vue inline style', () => {
+            expect(operator.getPreprocessorType({ resource: '/path/to/resource.vue?vue&type=style&index=0&id=2964abc9&scoped=true&lang=scss&'})).toEqual('sass');
+            expect(operator.getPreprocessorType({ resource: '/path/to/resource.vue?vue&type=style&index=0&id=2964abc9&scoped=true&lang=sass&'})).toEqual('sass');
+        });
+
+        it('should recognise sass resource in vue external style', () => {
+            expect(operator.getPreprocessorType({ resource: '/path/to/resource.scss?vue&type=style&index=0&id=0e4a89e8&scoped=true&lang=css&'})).toEqual('sass');
+            expect(operator.getPreprocessorType({ resource: '/path/to/resource.sass?vue&type=style&index=0&id=0e4a89e8&scoped=true&lang=css&'})).toEqual('sass');
+        });
+
         it('should recognise less resource', () => {
             expect(operator.getPreprocessorType({ resource: '/path/to/resource.less'})).toEqual('less');
         });
 
+        
+        it('should recognise sass resource in less inline style', () => {
+            expect(operator.getPreprocessorType({ resource: '/path/to/resource.vue?vue&type=style&index=0&id=2964abc9&scoped=true&lang=less&'})).toEqual('less');
+        });
+
+        it('should recognise sass resource in less external style', () => {
+            expect(operator.getPreprocessorType({ resource: '/path/to/resource.less?vue&type=style&index=0&id=0e4a89e8&scoped=true&lang=css&'})).toEqual('less');
+        });
+
         it('throw error if proprocessor type is unknown', () => {
             const caller = () => {
                 operator.getPreprocessorType({ resource: 'unknown.extension'});

From be25651151ac1b4d974aa8e76c17e52a6a6c4fbb Mon Sep 17 00:00:00 2001
From: constgen <const.gen@gmail.com>
Date: Sun, 28 Feb 2021 18:02:37 +0200
Subject: [PATCH 3/3] Add detection of external styles in Vue component

---
 index.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/index.js b/index.js
index 4e3352b..0721e62 100644
--- a/index.js
+++ b/index.js
@@ -109,11 +109,11 @@ const operator = {
         const preProcs = [
             {
                 type: 'sass',
-                reg: /\.scss$|\.sass$|\.vue\?.*?lang=scss|\.vue\?.*?lang=sass/
+                reg: /\.scss(\?vue.?|$)|\.sass(\?vue.?|$)|\.vue\?.*?lang=scss|\.vue\?.*?lang=sass/
             },
             {
                 type: 'less',
-                reg: /\.less$|\.vue\?.*?lang=less/
+                reg: /\.less(\?vue.?|$)|\.vue\?.*?lang=less/
             }
         ];