'How to import external css into Tailwind's app.css

I'm trying to use a 3rd party node_nodules which contains css i've tried importing it in various ways into tailwinds app.css in a remix application. The tailwind CSS stuff is being imported and working fine.

Any ideas on what i'm doing wrong?

@import "tailwindcss/base";
@import "tailwindcss/components";
@import "tailwindcss/utilities";

/* DID NOT WORK: */
/* @import '/node_modules/swiper/swiper-bundle.css';
   @import '/node_modules/swiper/swiper-bundle.min.css';
   @import '/node_modules/swiper/swiper.min.css'; */

/* DID NOT WORK: */
/* @import 'swiper/swiper-bundle.css';
   @import 'swiper/swiper-bundle.min.css';
   @import 'swiper/swiper.min.css'; */

/* DID NOT WORK: */
/* @import '~swiper/swiper-bundle.css';
   @import '~swiper/swiper-bundle.min.css';
   @import '~swiper/swiper.min.css'; */

My post.config.js looks like this:

    module.exports = {
  plugins: {
    'postcss-import': {},
    tailwindcss: {},
    autoprefixer: {},
  },
}

When I try to do npm run build in remix it just gets output as string of the import statement:

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source

'How to import external css into Tailwind's app.css

Sources

Related Questions