search

bholloway / resolve-url-loader

Webpack loader that resolves relative paths in url() statements based on the original source file
563 stars 71 forks source link

What settings are needed to set source path to a specific location? #193

Closed redfox05 closed 3 years ago

redfox05 commented 3 years ago

Hi,

Not exactly sure how to phrase this, so bear with me. I'm trying to use this package in order to fix the path problems im having while using a 3rd party theme together with my webpack setup. The 3rd party theme assumes the base .scss file is in a specific folder /myapp/frameworks/3rdpartytheme/custom/custom-styles.scss, and thus all the other imported scss files have their url() definitions referenced to this specific base path.

Here comes my problem. In order for us to easily be able to update this 3rd party dependancy folder (not in node_modules btw), we need to put any customization of variables in a directory outside of the 3rd party folder, which would be completely overwritten on an update. So we place our .scss file in /myapp/assets/custom-styles.scss and this file then @imports the theme files. Works fine for the actual theme as long as there are no url() references.

It seems what we need is in-between webpack assuming the root file is base, and resolve-url-loader assuming the source the line of code is in is the base.

Without rambling on, does this make sense, and any suggestions on where I should focus my reading to implement something to make this scenario work? I tried looking at the custom join function, but not sure if this is the right place.

redfox05 commented 3 years ago

I have posted a similar question on StackOverflow and also found https://github.com/bholloway/resolve-url-loader/issues/129 interesting, but im not sure if mine is the same issue.

bholloway commented 3 years ago

My first thought is to try the v4 alpha and look at the advanced usage docs.

The v4 docs are linked from the github root readme. And the v4 itself is installed using dist tag next.

Its likely you can solve your use case with a custom “join”. There are several examples shown in the docs.

When attempting a custom join I’d also suggest turning on the debug option to see where the loader is searching.

bholloway commented 3 years ago

Released resolve-url-loader@4.0.0-beta.1.

To reiterate, I think you would be in a much better position if you can adopt the beta and refer to the much improved docs for V4.

bholloway commented 3 years ago

The V4 docs are now quite mature so please take a look there.

I'm going to close this issue for now. Let's reopen if you wish to discuss further.