Complex (bad) relative import of token SCSS file

[pinguet62]

🐞 Pattern bug report

Where did you experience this bug ?

• [ ] On sketch file
• [ ] On Documentation
• [x] On source code

Is this a regression?

No.

Description

When I @import "@mozaic-ds/styles/settings-tools/all-settings"; I have an error because the (1st line) @import '_tokens.scss'; doesn't work... This require to configure includePaths of style loader in my project:

• Vue.js : in sass entry of vue.config.js
• Angular: stylePreprocessorOptions entry of angular.json
• worse: use a plugin with side effects...

Do you have any solution to avoid this configuration? For example merge @mozaic-ds/styles with @mozaic-ds/tokens, or in _all-settings.scss use @import '@mozaic-ds/tokens/build/scss/tokens';, ...

🔬 Steps to reproduce the issue

vue create -d hello-world
cd hello-world
npm install @mozaic-ds/styles
npm run serve

set <style> in App.vue file

<style lang="scss">
@import "~@mozaic-ds/styles/settings-tools/all-settings";
</style>

📷 Screenshot (optional - it might be a gif) or Sketch file (if existing)

🔥 Exception or Error

🌍 Your Environment

Styleguide Version:

Anything else relevant?

[ghost]

Any news of this issue ? I have the same problem. How can I fix it ? Thanks

[Maxim-Ishenko]

I've the same problem with react. Could you share some info about it?

[pinguet62]

Not really solved, is it?