Skip to content

[1.3.2+] Can't import css contained in npm package (from a @import in another css) #6846

@tcastelli

Description

@tcastelli

I have followed #6037 instructions, installed fourseven:scss and I have loaded scss files from external packages inside my local "atmosphere" package.

The problem comes after that, since when I try to import any local/external css (eg. @import "font-awesome/css/font-awesome.css";) from my css files inside the atmosphere package i get

warn: there are some @import rules those are not taking effect as they are required to be in the beginning of the file 

This can be solved by adding something after the import like .dummy{}; however, besides not getting the error, the file wont be bundled, and it will be looked at localhost:300/font-awesome/css/font-awesome.css which is clearly not the path to look it

The same behaviour happens when I try to import a CSS file from a CSS from the following locations:

  • atmosphere package
  • any other folder inside /client

the only way I have found to solve it, is to import the css from a javascript file. (In my case this is not a solution because of load order problems, because I need to attach that CSS to the head instead of doing an insert of the style with a require to keep the correct order)

To reproduce this, simply install any npm package with scss, then the fourserven:scss with autoprefixer package and try to load CSS from another CSS file with @import "libname/css/...."

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions