Web framework: Astro 5.2 brings support for Tailwind CSS 4.0

The minor release simplifies the connection to Tailwind CSS and automatically redirects URLs with trailing slashes.

(Image: Trismegist san/Shutterstock.com)

Feb 3, 2025 at 12:59 pm CET

3 min. read

By

Maika Möbus

The JavaScript web framework Astro has received its first minor release of the year with version 5.2. It includes a connection to Tailwind CSS 4.0, a new way of handling trailing slashes and two experimental features relating to configuration settings and React streaming.

Automatic redirection for trailing slashes

As the Astro team explains, the use of trailing slashes – at the end of a URL – is controversial in web development. However, there is a consensus that their use should be consistent so as not to have a negative impact on search engine optimization and user experience.

Previously, Astro allowed you to configure whether routes with or without trailing slash should be used and returned a "not found" page if the option was not selected or left it up to the host to deal with the conflict. The new Astro version 5.2 handles this differently, as it automatically redirects to the correct path as defined in the trailingSlash option in astro.config.mjs.

This option can be set as follows:

export default defineConfig({
  adapter: node({ mode: 'standalone' }),
  trailingSlash: 'never', // or 'always'
});

In practice, it then no longer matters whether users call /about/, /about or even /about///, as all variants lead to the correct website.

Videos by heise

Simplified Tailwind CSS support

In the recently released version Tailwind CSS 4.0, the open source CSS framework brought the new Vite plug-in @tailwindcss/vite with it. Astro 5.2 contains native support for this plug-in and thus simplifies the connection to Tailwind CSS. It can be used in Astro with the command astro add tailwind and creates a default CSS file that imports tailwind styles.

Therefore, the previous variant, the @astrojs/tailwind integration, is now considered deprecated. To update to Tailwind CSS 4.0, developers must uninstall this integration and either use the above command or perform a manual installation.

Experimental features for configuration and React streaming

In addition to other updates and bug fixes, there are two experimental features in Astro 5.2, including the new virtual module astro:config. This should allow the most important configuration settings to be viewed from anywhere in the project. In future, astro:config will become the standard.

The second experimental feature is the option to deactivate React streaming in the @astrojs/react integration. This should be helpful when using libraries that are not compatible with streaming, such as many CSS-in-JSS libraries.

Astro is a web framework that is characterized in particular by its frontend architecture pattern, the Islands architecture. This renders the majority of a page as fast, static HTML, while smaller "islands" of JavaScript are used for interactivity and personalization.

Further information on the new release can be found on the Astro blog.

Enterprise JavaScript Conference enterJS 2025, May 7 and 8 in Mannheim, Germany — (Image: WD Ashari/Shutterstock.com)

enterJS 2025 will take place on May 7 and 8 in Mannheim. The conference offers a comprehensive look at the JavaScript-supported enterprise world. The focus is not only on the programming languages JavaScript and TypeScript themselves, but also on frameworks and tools, accessibility, practical reports, UI/UX and security.

Highlights from the program: