Support Webpack aliases

[ovidiu-bute-hs]

I work in a large codebase and this plugin could be extremely valuable to us but for one issue: we use webpack aliases for imports and currently only real imports are supported.

Example:

@import "~styles/constants/spacing.less";
@import "../constants/colors.less";

The first import is ignored, the second one resolves correctly and provides IntelliSense for all variables from colors.less.

I believe that it should be possible to provide the user an option to provide the path to his webpack configuration and the plugin could read the aliases from there and correctly resolve the imports. Parsing the aliases can be achieved pretty easily since the webpack configuration is standard.

I'd be happy to add this change myself but I'd love it if someone could point me in the right direction in regards to how sane this proposal is and how doable it is considering the existing codebase.

[lwyj123]

+1

[minkir014]

maybe you can change the way you import that stylesheet with. so, extension can understand that.

[cdeutsch]

I'd settle for just hard coding a list of files to read in the extension config.

Ex:

less.scannerInclude: ["./root/constants/colors.less"];

Is that possible?

[theoephraim]

Please don't couple this kind of support too closely to webpack if possible. Other build tools are starting to gain some traction again. For example I'd love to have it support vite's aliases as well - see https://vitejs.dev/config/#resolve-alias

[Nettsentrisk]

Related: Jump to definition (ctrl+click) for import statements that do not have a file extension. Common convention with Webpack for import URLs to not have extension, resolves automatically via Webpack resolve extension settings.