Import CSS file from NPM package

I use METEOR@ and Stylus.
I’m trying to import CSS file from NPM package located at node_modules/angular-material-data-table/dist/md-data-table.css

@import 'angular-material-data-table/dist/md-data-table.css'
@import '{}/node_modules/angular-material-data-table/dist/md-data-table.css'

Both import statements throw the error:

Resource interpreted as Stylesheet but transferred with MIME type text/html: 

Can somebody help me what the path I should use to include CSS file from NPM?

According to the Stylus pre-processsor documentation the correct syntax would be:

@import '{}/node_modules/angular-material-data-table/dist/md-data-table.css'

assuming Meteor’s Stylus package actually supports importing .css files (don’t know as we don’t use Stylus). Can you import the file if you copy it to /imports/ with @import '/imports/md-data-table.css'; ?

Are you able to import any .styl files from node_modules?

Stylus should be able to import .css files ( )
I gues this is something wrong with Meteor’s imports from node_modules or forked Stylus in core ‘stylus’ package.

Agreed, but it looks like Meteor’s Stylus package does not support all the capabilities of the NPM version, so not sure it supports @import of CSS. I’m just speculating though.

Yes, It could be. It’s forked :slight_smile: I use Stylus a lot and I never wanted to import .css file into .styl files (but this is just me, I can see that it could be helpful).
I gues for now the better way is to just import .css file in .js file. Like:

import 'angular-material-data-table/dist/md-data-table.css';

especially when you use Angular ‘components’.

Thank you, guys! The only way that really works is import 'angular-material-data-table/dist/md-data-table.css';