Convert tailwind to ESM from CJS #2998

FranjoMindek · 2025-07-24T10:56:27Z

Description

Makes Wasp use ESM for Tailwind configuration files.

Fixes #2996 .

Select what type of change this PR introduces:

Just code/docs improvement (no functional change).
Bug fix (non-breaking change which fixes an issue).
New feature (non-breaking change which adds functionality).
Breaking change (fix or feature that would cause existing functionality to not work as expected).

Update Waspc ChangeLog and version if needed

If you did a bug fix, new feature, or breaking change, that affects waspc, make sure you satisfy the following:

I updated ChangeLog.md with description of the change this PR introduces.
I bumped waspc version in waspc.cabal to reflect changes I introduced, with regards to the version of the latest wasp release, if the bump was needed.

Update example apps if needed

If you did code changes and updated an existing feature, make sure you satisfy the following:

I updated waspc/examples/todoApp and its e2e tests as needed and manually checked it works correctly.

Update starter apps if needed

If you did code changes and updated an existing feature, make sure you satisfy the following:

I updated starter skeleton as needed and manually checked it works correctly.
I updated basic starter as needed and manually checked it works correctly.
I updated todo-ts starter as needed and manually checked it works correctly.
I updated embeddings starter as needed and manually checked it works correctly.
I updated saas starter as needed and manually checked it works correctly.

Update e2e tests if needed

If you did code changes and changed Wasp's code generation logic, make sure you satisfy the following:

I updated e2e tests as needed and manually checked they are correct.

cloudflare-workers-and-pages · 2025-07-24T10:57:27Z

Deploying wasp-docs-on-main with Cloudflare Pages

Latest commit:	`bd65575`
Status:	✅ Deploy successful!
Preview URL:	https://b7341ce1.wasp-docs-on-main.pages.dev
Branch Preview URL:	https://franjo-tailwind-ems.wasp-docs-on-main.pages.dev

View logs

infomiho · 2025-07-24T11:24:02Z

@FranjoMindek heads up, maybe we move Tailwind to user-land with 0.18.0 already. After we migrate the Vite version, I think it will 100% doable.

FranjoMindek · 2025-07-24T11:44:27Z

@FranjoMindek heads up, maybe we move Tailwind to user-land with 0.18.0 already. After we migrate the Vite version, I think it will 100% doable.

Yes, I asked this question specifically during the last meeting.
The response was though to solve this issue. A bit weird but I followed with the majority opinion.

waspc/ChangeLog.md

sodic

This makes sense.

I haven't tested it and I haven't verified you got all occurences. I thought you all the tricks I know for finding stuff, so I trust you used them :)

The only real problem is the changelog mistake.

sodic · 2025-07-31T20:55:45Z

waspc/ChangeLog.md

+
+### ⚠️ Breaking Changes
+
+- Wasp now uses CommonJS (CJS) instead of ECMAScript Modules (ESM) for Tailwind configuration files. ([#2998](https://github.com/wasp-lang/wasp/pull/2998))


The opposite I think.

sodic · 2025-07-31T20:56:47Z

web/docs/migration-guides/migrate-from-0-17-to-0-18.md

+
+### 1. Rename Tailwind Configuration Files
+
+Update the file extensions from `.cjs` to `.js`:


Suggested change

Update the file extensions from `.cjs` to `.js`:

Update the Tailwind configuration files' extensions from `.cjs` to `.js`:

sodic · 2025-07-31T20:57:30Z

web/docs/migration-guides/migrate-from-0-17-to-0-18.md

+
+### 2. Convert CJS Syntax to ESM
+
+Update your `tailwind.config.cjs` file to use ESM.


But they already updated the extension, so it's no longer cjs. Perhaps this should be step 1?

True. I wrote steps independently, but didn't catch this out of order mistake.
I'll leave the order, but fix this.

I switched them in the end, so there is less confusion.

sodic · 2025-07-31T20:58:49Z

web/docs/migration-guides/migrate-from-0-17-to-0-18.md

+<Tabs>
+<TabItem value="before" label="Before">


Oh, this is the final product, with both steps? Then I'd separate it into its own section.

This was meant to show only the cjs -> esm change, but since we already did step 1 i also changed the name.
Hm.

Maybe then I should switch the steps after all so there is less confusion.
And have this be tailwind.config.cjs for both instances.

Switched them, makes sense now.

sodic · 2025-07-31T20:59:58Z

waspc/waspc.cabal

Should we bump the version too? Probably not, just double checking.

We had this discussion once during initial onboarding, I think the answer was that it doesn't really matter, since we always do it on release. Or something like that. But the answer was that it doesn't really matter.

# Conflicts: # waspc/ChangeLog.md

FranjoMindek · 2025-08-01T08:55:03Z

I my initial search I did miss tailwind.config.cjs files outside of waspc and web, probably was my search restriction?
I've converted all examples apps + mage (also bumped up its wasp verison)

sodic

Looks good, but please check the last two comments

sodic · 2025-08-01T11:20:28Z

examples/waspello/tailwind.config.js

@@ -10,4 +10,4 @@ module.exports = {
    extend: {},
  },
  plugins: [],
-};
+};


Many of these files are missing newlines at the end. Can prettier take care of that?

sodic · 2025-08-01T11:29:34Z

web/docs/migration-guides/migrate-from-0-17-to-0-18.md

I'm not seeing this file in the docs. Is that on purpose?

FranjoMindek added 2 commits July 24, 2025 12:54

changes

81d133e

changelog

da1fe57

FranjoMindek self-assigned this Jul 24, 2025

remove cjs files

6267576

FranjoMindek marked this pull request as ready for review July 24, 2025 11:58

FranjoMindek commented Jul 24, 2025

View reviewed changes

waspc/ChangeLog.md Outdated Show resolved Hide resolved

change changelog

3a9ad6b

FranjoMindek requested a review from sodic July 25, 2025 09:30

sodic reviewed Jul 31, 2025

View reviewed changes

FranjoMindek added 3 commits August 1, 2025 10:16

fixes

4a332a8

Merge remote-tracking branch 'origin/main' into franjo/tailwind-ems

d504989

# Conflicts: # waspc/ChangeLog.md

changes

bd65575

FranjoMindek added 3 commits August 1, 2025 10:56

newline

c049c8c

finish migration

189ab21

reorder

8363888

sodic approved these changes Aug 1, 2025

View reviewed changes


		### ⚠️ Breaking Changes

		- Wasp now uses CommonJS (CJS) instead of ECMAScript Modules (ESM) for Tailwind configuration files. ([#2998](https://github.com/wasp-lang/wasp/pull/2998))


		### 1. Rename Tailwind Configuration Files

		Update the file extensions from `.cjs` to `.js`:

	Update the file extensions from `.cjs` to `.js`:
	Update the Tailwind configuration files' extensions from `.cjs` to `.js`:


		### 2. Convert CJS Syntax to ESM

		Update your `tailwind.config.cjs` file to use ESM.

		<Tabs>
		<TabItem value="before" label="Before">

Uh oh!

Convert tailwind to ESM from CJS #2998

Are you sure you want to change the base?

Convert tailwind to ESM from CJS #2998

Conversation

FranjoMindek commented Jul 24, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Select what type of change this PR introduces:

Update Waspc ChangeLog and version if needed

Update example apps if needed

Update starter apps if needed

Update e2e tests if needed

Uh oh!

cloudflare-workers-and-pages bot commented Jul 24, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Deploying wasp-docs-on-main with Cloudflare Pages

Uh oh!

infomiho commented Jul 24, 2025

Uh oh!

FranjoMindek commented Jul 24, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

sodic left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

FranjoMindek Aug 1, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

FranjoMindek Aug 1, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

FranjoMindek commented Aug 1, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

sodic left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

FranjoMindek commented Jul 24, 2025 •

edited

Loading

cloudflare-workers-and-pages bot commented Jul 24, 2025 •

edited

Loading

FranjoMindek commented Jul 24, 2025 •

edited

Loading

FranjoMindek Aug 1, 2025 •

edited

Loading

FranjoMindek Aug 1, 2025 •

edited

Loading

FranjoMindek commented Aug 1, 2025 •

edited

Loading