Webpack4,sass-laoder uses alias to report errors

when upgrading webpack4, it is found that alias, defined by webpack in scss will burst path errors

"webpack": "^ 4.6.0",
"node-sass": "^ 4.9.0",
"sass": "^ 1.3.2",
"sass-loader": "^ 7.0.1",

scss:


      .icon {
        background-image: url(~assets/images/mobile/common/broadcast.png);
      }

webpack:

alias: {
            "@": path.resolve(__dirname, "../src"),
            "src": path.resolve(__dirname, "../src"),
            "components": path.resolve(__dirname, "../src/components"),
            "page": path.resolve(__dirname, "../src/page"),            
            "assets": path.resolve(__dirname, "../src/asstes"),         
            "store": path.resolve(__dirname, "../src/store"),
            "utils": path.resolve(__dirname, "../src/utils"),
            "libs": path.resolve(__dirname, "../src/libs")
        }

result:
clipboard.png

I"m sure the path is right. I won"t post the path, because there"s no problem with changing it to a relative path. This problem, upgraded people, should have appeared, I would like to ask you how to solve it.

Mar.13,2021

I remember that alias defined by webpack only changes require and import, in js without affecting style import

Menu