8000 Update upgrading guide · activeadmin/activeadmin@99c9780 · GitHub
[go: up one dir, main page]
Skip to content

Commit 99c9780

Browse files
taglialatagliala
committed
Update upgrading guide
1 parent 93bb3d7 commit 99c9780

File tree

1 file changed

+40
-2
lines changed

1 file changed

+40
-2
lines changed

‎UPGRADING.md

Lines changed: 40 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -15,8 +15,8 @@ Now, run `rails generate active_admin:assets` to replace the old assets with the
1515
Then add the npm package and update the `build:css` script.
1616

1717
```
18-
yarn add @activeadmin/activeadmin@4.0.0-beta15
19-
npm pkg set scripts.build:css="tailwindcss -i ./app/assets/stylesheets/active_admin.css -o ./app/assets/builds/active_admin.css --minify -c tailwind-active_admin.config.js"
18+
yarn add @activeadmin/activeadmin@4.0.0-beta16
19+
npm pkg set scripts.build:css="tailwindcss -i ./app/assets/stylesheets/active_admin.css -o ./app/assets/builds/active_admin.css --minify"
2020
```
2121

2222
If you are already using Tailwind in your app, then update the `build:css` script to chain the above command to your existing one, e.g. `"tailwindcss ... && tailwindcss ..."`, so both stylesheets are generated.
@@ -47,6 +47,44 @@ Note that the templates can and will change across releases. There are additiona
4747

4848
With the setup complete, please review the Breaking Changes section and resolve any that may or may not impact your integration.
4949

50+
### Upgrading from earlier 4.x beta to 4.0.0.beta16
51+
52+
Starting with version 4.0.0.beta16, ActiveAdmin has migrated from TailwindCSS v3 to TailwindCSS v4.
53+
54+
If you're upgrading from any earlier 4.0.0 beta release, please review and apply the required adjustments outlined below.
55+
56+
Update your `active_admin.css` file:
57+
58+
```diff
59+
-@tailwind base;
60+
-@tailwind components;
61+
-@tailwind utilities;
62+
+@import "tailwindcss";
63+
+
64+
+@config "../../../tailwind-active_admin.config.js";
65+
```
66+
67+
Update the `build:css` script in your `package.json`:
68+
69+
```diff
70+
-"build:css": "tailwindcss -i ./app/assets/stylesheets/active_admin.css -o ./app/assets/builds/active_admin.css --minify -c tailwind-active_admin.config.js"
71+
+"build:css": "tailwindcss -i ./app/assets/stylesheets/active_admin.css -o ./app/assets/builds/active_admin.css --minify"
72+
```
73+
74+
You may see the following warning when upgrading:
75+
76+
```
77+
[MODULE_TYPELESS_PACKAGE_JSON] Warning: Module type of tailwind-active_admin.config.js is not specified and it doesn't parse as CommonJS.
78+
Reparsing as ES module because module syntax was detected. This incurs a performance overhead.
79+
To eliminate this warning, add "type": "module" to ./package.json.
80+
```
81+
82+
This happens because the Tailwind config file uses ES module syntax.
83+
84+
To fix it, either:
85+
- Rename `tailwind-active_admin.config.js` to `tailwind-active_admin.config.mjs`; or
86+
- Add `"type": "module"` to your package.json (your application may already be compatible with ESM).
87+
5088
### Breaking Changes
5189
- jQuery and jQuery UI have been removed.
5290
- The `columns` component has been removed. Use `div`'s with Tailwind classes for modern, responsive layout.

0 commit comments

Comments
 (0)
0