Add css-loader configuration callback

symfony · Jun 19, 2018 · 71021db · 71021db
1 parent 2a1a18a
commit 71021db
Show file tree

Hide file tree

Showing 4 changed files with 53 additions and 9 deletions.
diff --git a/index.js b/index.js
@@ -581,6 +581,22 @@ class Encore {
         return this;
     }
 
+    /**
+     * Configure the css-loader.
+     *
+     * Encore.configureCssLoader(function(config) {
+     *      // change the config
+     * });
+     *
+     * @param {function} callback
+     * @returns {Encore}
+     */
+    configureCssLoader(callback) {
+        webpackConfig.configureCssLoader(callback);
+
+        return this;
+    }
+
     /**
      * If enabled, the react preset is added to Babel.
      *

diff --git a/lib/WebpackConfig.js b/lib/WebpackConfig.js
@@ -86,6 +86,7 @@ class WebpackConfig {
         this.lessLoaderOptionsCallback = () => {};
         this.stylusLoaderOptionsCallback = () => {};
         this.babelConfigurationCallback = () => {};
+        this.cssLoaderConfigurationCallback = () => {};
         this.vueLoaderOptionsCallback = () => {};
         this.eslintLoaderOptionsCallback = () => {};
         this.tsConfigurationCallback = () => {};
@@ -319,6 +320,14 @@ class WebpackConfig {
         this.babelConfigurationCallback = callback;
     }
 
+    configureCssLoader(callback) {
+        if (typeof callback !== 'function') {
+            throw new Error('Argument 1 to configureCssLoader() must be a callback function.');
+        }
+
+        this.cssLoaderConfigurationCallback = callback;
+    }
+
     createSharedEntry(name, files) {
         // don't allow to call this twice
         if (this.sharedCommonsEntryName) {

diff --git a/lib/loaders/css.js b/lib/loaders/css.js
@@ -21,18 +21,20 @@ module.exports = {
     getLoaders(webpackConfig, skipPostCssLoader) {
         const usePostCssLoader = webpackConfig.usePostCssLoader && !skipPostCssLoader;
 
+        const options: {
+            minimize: webpackConfig.isProduction(),
+            sourceMap: webpackConfig.useSourceMaps,
+            // when using @import, how many loaders *before* css-loader should
+            // be applied to those imports? This defaults to 0. When postcss-loader
+            // is used, we set it to 1, so that postcss-loader is applied
+            // to @import resources.
+            importLoaders: usePostCssLoader ? 1 : 0
+        };
+
         const cssLoaders = [
             {
                 loader: 'css-loader',
-                options: {
-                    minimize: webpackConfig.isProduction(),
-                    sourceMap: webpackConfig.useSourceMaps,
-                    // when using @import, how many loaders *before* css-loader should
-                    // be applied to those imports? This defaults to 0. When postcss-loader
-                    // is used, we set it to 1, so that postcss-loader is applied
-                    // to @import resources.
-                    importLoaders: usePostCssLoader ? 1 : 0
-                }
+                options: applyOptionsCallback(webpackConfig.cssLoaderConfigurationCallback, options)
             },
         ];
 

diff --git a/test/WebpackConfig.js b/test/WebpackConfig.js
@@ -436,6 +436,23 @@ describe('WebpackConfig object', () => {
         });
     });
 
+    describe('configureCssLoader', () => {
+        it('Calling method sets it', () => {
+            const config = createConfig();
+            const testCallback = () => {};
+            config.configureCssLoader(testCallback);
+            expect(config.cssLoaderConfigurationCallback).to.equal(testCallback);
+        });
+
+        it('Calling with non-callback throws an error', () => {
+            const config = createConfig();
+
+            expect(() => {
+                config.configureCssLoader('FOO');
+            }).to.throw('must be a callback function');
+        });
+    });
+
     describe('enablePostCssLoader', () => {
         it('Call with no config', () => {
             const config = createConfig();