[v4.0.0-98] url function in sass dont work as expected

[huneau]

Describe the bug

Im working on typescript 4.x in react 16.x without any issues.
I decide to install typescript eslint with the new projects eslint-typescript + typescript-parser
The actual 3.4.3 react-script has a known bug with theses 2 projects because the version is 2.0.1 which are also bug with the rules: no-use-before-define 🎉
To solve this I update react to the nightly 99 which solved the issue with no-use-before-define but I have now a new bug.
the behavior of sass-loader seems change on background-image: url('/img/logo.jpg'). the Url function dont work anymore 🤔

I dont expect any quick fix. Its eslint, I just remove it, rollback deps and now its working like before.

Environment

  System:
    OS: Windows 10 10.0.19041
    CPU: (4) x64 Intel(R) Core(TM) i5-6200U CPU @ 2.30GHz
  Binaries:
    Node: 12.18.2 - C:\Program Files\nodejs\node.EXE
    Yarn: Not Found
    npm: 6.14.5 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: 44.19041.423.0
    Internet Explorer: 11.0.19041.1
  npmPackages:
    react: 16.13.1 => 16.13.1
    react-dom: 16.13.1 => 16.13.1
    react-scripts: 3.4.3 => 3.4.3
  npmGlobalPackages:
    create-react-app: Not Found

Expected behavior

url function in sass should work as before.

Actual behavior

url function in sass seems to use relative path from the actual dev scss file not from the run env

[thomasleduc]

Yep, like @kidwn said, we created a duplicate issue 9937 but since the discussion is going further on the new one. We should keep it.

As I understand, create-react-app would try to inject the assets into url data relatively to the project file if the file size limit is not overpassed, else it refers to the file via http public url.

I'm not sure if the url('/img/logo.png') was supposed to work in 3.4.3, I used it this way too but we probably should have used url('%PUBLIC_URL%/img/logo.png') or relative path to project file url('../assets/img/logo.png').

One more thing, there is a different behaviour if the url begins by a . :

options: paths.publicUrlOrPath.startsWith('.')
          ? { publicPath: '../../' }
          : {},

But let's continue this discussion into #9937 ;)

[huneau]

Ok, as I say, I dont worry, I just rollback, you can close this issue if you have another one. :)

[stale]

This issue has been automatically marked as stale because it has not had any recent activity. It will be closed in 5 days if no further activity occurs.