Parcel: Can't find stylesheet to import

[FDiskas]

🐛 bug report

Can't import any node_module to scss file.
Tried like:

@import 'bourbon';
@import '~/bourbon/core/_bourbon.scss';
@import '~/node_modules/bourbon/core/_bourbon.scss';

🎛 Configuration (.babelrc, package.json, cli command)

No configs was used

🤔 Expected Behavior

Guess what...

😯 Current Behavior

🚨  /src/layouts/main/MainLayout.scss:2:9: Can't find stylesheet to import.
  ╷
2 │ @import '~/node_modules/bourbon/core/_bourbon.scss';
  │         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  ╵
  src/layouts/main/MainLayout.scss 2:9  root stylesheet

💁 Possible Solution

Works only if I enter path like

@import '~node_modules/bourbon/core/bourbon';
/* or this */
@import '~bourbon/core/_bourbon.scss';

NOTE no / after ~
But in documentation its not mentioned

🔦 Context

💻 Code Sample

https://github.com/FDiskas/parcel-bug

🌍 Your Environment

| Software | Version(s) |
| ---------------- | ---------- |
| Parcel | 1.12.3
| Node | v10.16.0
| npm/Yarn | 6.9.0/1.16.0
| Operating System | Fedora (LINUX)

[FDiskas]

Could this be sovled by using https://github.com/postcss/postcss-import ?
Works if I enter path without /
like so

@import '~node_modules/bourbon/core/bourbon';

[FDiskas]

Any news?

[FDiskas]

Any news - workarounds?

[DeMoorJasper]

@import '~node_modules/bourbon/core/bourbon'; that should be @import '~bourbon/core/bourbon'; seems like a bug if you have to prefix it with node_modules, also in that case it should be ~/node_modules which apparently does not work, it's a bug but you already found the workaround so not sure why you keep asking for a workaround?

Imports in css are a mess and not sure how to do it properly. This is due to all kinds of different defaults being introduced by webpack and the css community instead of just requiring relative paths and using. Node.js spec for this.

[FDiskas]

I'm sorry I totally forgot about workaround. But still it's not works as it's supposed to

[DeMoorJasper]

@FDiskas I doubt we'll fix this in Parcel 1, we've been tweaking and changing this quite a lot and changing this again would be a breaking change.

Parcel 2 will hopefully be more reliable for this, we're still trying to figure out how we should handle this properly due to the various different standards for these imports. Even with webpack and postcss import you can define your own prefix. Maybe we should just default to the node.js standard and allow this to be customized using postcss plugins.

[FDiskas]

So probably this issue should be closed