Skip to content

Deprecated @import in Bootstrap SCSS causes issues in modern environments (e.g. Next.js) #41353

@ghost

Description

Bootstrap is still using @import in its .scss files, which is deprecated in Dart Sass and causes issues in modern build systems like Next.js (especially with strict or future Sass modes).

Steps to Reproduce:

  • Use Bootstrap via Sass in a Next.js project.
  • Build the project with strict Sass (or latest versions).

Expected:

  • Bootstrap should use @use and @forward for modular and future-proof compatibility.

Actual:

  • Sass throws deprecation warnings or errors depending on config.

Suggested Fix:

  • Migrate internal Bootstrap SCSS to the modern @use system, as recommended by Sass maintainers

Environment:

  • Next.js 14+
  • Dart Sass
  • Bootstrap version: 5.x.x

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions