Skip to content

Commit 3f5c307

Browse files
author
Jalen Muller
committed
Document the configureCssLoader method
1 parent 07e3d4b commit 3f5c307

File tree

1 file changed

+25
-0
lines changed

1 file changed

+25
-0
lines changed

frontend/encore/advanced-config.rst

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -198,6 +198,31 @@ Now you can inject your service into your class::
198198
$this->render($emailTwo);
199199
}
200200

201+
Configuring the CSS Loader
202+
--------------------------
203+
204+
Encore provides the method ``configureCssLoader()`` to configure options for ``css-loader``. This method allows you to customize how Webpack processes CSS assets.
205+
206+
A common use case is filtering certain URLs so that Webpack does not attempt to resolve them. For example, if user-uploaded assets are stored under in a user uploaded directory, Webpack should not process these paths since they may not exist at build time.
207+
208+
Use ``configureCssLoader()`` as follows:
209+
210+
.. code-block:: javascript
211+
// Configuring the CSS Loader in Webpack Encore
212+
// This ensures that Webpack does not attempt to resolve certain URLs in CSS files
213+
214+
Encore.configureCssLoader((options) => {
215+
options.url = {
216+
filter: (url) => {
217+
// Ignore URLs that start with /uploads/
218+
if (url.startsWith('/uploads/')) {
219+
return false;
220+
}
221+
return true; // Process other URLs normally
222+
},
223+
};
224+
});
225+
201226
Generating a Webpack Configuration Object without using the Command-Line Interface
202227
----------------------------------------------------------------------------------
203228

0 commit comments

Comments
 (0)