Support for Webpack resolve aliases

[mjc-gh]

Is it possible to support webpack resolve aliases?

I prefer to use alias rather than have to import off relative paths.

[guoerwei]

+1

[moorthy-g]

Yes, It'd be helpful

[tyler-dot-earth]

You can achieve resolve aliases except for composes via this method of using a PostCSS import plugin which supports aliases.

Haven't looked into trying to get composes working with the same aliases though (i.e. so those still have to ../be/relative/imported.css)

[impssngr]

You can just use postcss plugin 'postcss-import' and configure it for resolving your modules in postcss.config.js:

const path = require('path')

const importLoader = require('postcss-import')({
  extension: '.scss', // default is '.css'
  resolve: (id) => {
    if (id === 'MyCSSVariables') return path.resolve(__dirname, './path/to/your/file.scss');
    return id;
  },
});

module.exports = {
  plugins: [importLoader],
};

and then use it like that:

@import "MyCSSVariables"

in every file that needs access to the variables

Hope it helps!

[toc777]

Is there any plan to work on this? I'd love to use this plugin over react-css-modules but I use a lot of webpack aliases. Is it possible to use the babel module resolver instead of require.resolve? If so, I could potentially use another babel-resolver plugin to set up the aliases.

[gajus]

No plans to support custom resolve paths.

[moimikey]

bit of a terrible blocker to be honest... what's it take for a contributor to add support for this? is it feasible/possible?

[danny-andrews]

@moimikey I'd recommend switching over to using css-modules directly via the https://github.com/webpack-contrib/css-loader. It works fine with webpack aliases.

[CoralSilver]

I'd like support for this as well if possible.

[moimikey]

@danny-andrews went right above my head. thanks.

[bhavyaw1]

+1

Is there any plan to support this?