How to use aliases?

[yurkimus]

I have "alias": { "styles": "./styles" } in my package.json

When I tried to import .css files like this @import 'styles/variables.css'; - it does error Cannot resolve dependency 'styles/variables.css.

How to use aliases right?

[DeMoorJasper]

Maybe you could try @import '~styles/variables.css';

Which Parcel version are you using?

[yurkimus]

I use "parcel-bundler": "^1.12.4"

'~' helps, thanks. But it looks strange to me. Can I use aliases without it?

p.s.: My IDE can't understand what to do :(

[DeMoorJasper]

using node_modules in css is not standard, that's probably why the IDE freaks out.

~ has nothing to do with aliases, it's just something you need to do in Parcel 1 to use node_modules in css. Aliases are just virtual node_modules. So unfortunately you can't use them without.

I think we dropped the ~ prefix in Parcel 2 but not entirely sure, we just wanted to support the import syntax that gets used by webpack and postcss-import, this is mainly because relative paths in css imports don't have to start with ./ and you could have duplicates...

[yurkimus]

Thanks.