Revert "Disable vue style loader (laravel-mix#2981)"

This reverts commit eeb3dd8.
thecrypticace · Jun 10, 2021 · 31dfed6 · 31dfed6
1 parent e13131d
commit 31dfed6
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 7 deletions.
diff --git a/src/components/CssWebpackConfig.js b/src/components/CssWebpackConfig.js
@@ -186,7 +186,11 @@ class CssWebpackConfig extends AutomaticComponent {
         }
 
         if (method === 'inline') {
-            loaders.push({ loader: 'style-loader' });
+            if (Mix.components.get('vue') && location === 'default') {
+                loaders.push({ loader: 'vue-style-loader' });
+            } else {
+                loaders.push({ loader: 'style-loader' });
+            }
         } else if (method === 'extract') {
             loaders.push({
                 loader: MiniCssExtractPlugin.loader,

diff --git a/test/features/vue.js b/test/features/vue.js
@@ -38,13 +38,13 @@ test('it knows the Vue 2 compiler name', t => {
     t.true(dependencies.includes('vue-template-compiler'));
 });
 
-test('DISABLED: it switches to vue-style-loader when not extracting styles', async t => {
+test('it switches to vue-style-loader when not extracting styles', async t => {
     mix.vue({ version: 2, extractStyles: false });
 
     const config = await webpack.buildConfig();
 
-    assert.doesNotHaveWebpackLoader(t, config, 'vue-style-loader');
-    assert.hasWebpackLoader(t, config, 'style-loader');
+    assert.hasWebpackLoader(t, config, 'vue-style-loader');
+    assert.doesNotHaveWebpackLoader(t, config, 'style-loader');
     assert.doesNotHaveWebpackLoader(t, config, /mini-css-extract-plugin/);
 });
 

diff --git a/test/features/vue3.js b/test/features/vue3.js
@@ -34,13 +34,13 @@ test('it knows the Vue 3 compiler name', t => {
     t.true(dependencies.includes('@vue/compiler-sfc'));
 });
 
-test('DISABLED: it switches to vue-style-loader when not extracting styles', async t => {
+test('it switches to vue-style-loader when not extracting styles', async t => {
     mix.vue({ version: 3, extractStyles: false });
 
     const config = await webpack.buildConfig();
 
-    assert.doesNotHaveWebpackLoader(t, config, 'vue-style-loader');
-    assert.hasWebpackLoader(t, config, 'style-loader');
+    assert.hasWebpackLoader(t, config, 'vue-style-loader');
+    assert.doesNotHaveWebpackLoader(t, config, 'style-loader');
     assert.doesNotHaveWebpackLoader(t, config, loader =>
         loader.includes('mini-css-extract-plugin')
     );