Better Alpine.js error messages to close out 2020
If you missed it on Twitter/GitHub, this week's Alpine.js release (2.8.0) adds better error messages when Alpine.js hits an eval error. It uses console.warn
under the hood so you might want to display those when working on an Alpine.js project.
Sample error messages:
This email is supported by my GitHub Sponsors.
This will be the last issue of the newsletter for 2020, I'm taking a break until the New Year, if you've got anything to share, make sure to submit your link and happy holidays to everyone in the Alpine community.
Tips
Quick TailwindUI tip for alpine users:
If you are also too lazy to add the transitions yourself. Go into the element inspector in your dev tools and copy them directly from the HTML. pic.twitter.com/1k70xIPuFh
β ππ²πΉπΆπ π¦π°π΅πΌπΉπ π» (@scholz_felix) December 18, 2020
Made with Alpine.js
If you've got something to share with the Alpine.js community, you can submit your link or reach out to me on twitter @hugo__df.
Demos:
- a tag multiselect where Alpine shines over React by @DCoulbourne
- tailwindcss responsive dashboard layout is now also available as a codepen by @ak_kamona
- editable Alpine.js demos on the Alpine.js Playground by @hugo__df
Articles & Tutorials
[Video] Intro to Alpine.js in Just 7 Minutes by @PovilasKorop
Create a Typing Effect in AlpineJS by @tnylea
For more posts like these, you can join the Alpine.js Development Subscription, it's a great way to support the newsletter and get early access to Alpine.js content.
Code & Tools
Spruce v2.3.0 by @ryangjchandler has been released with a fix for array watchers.
Alpine.js devtools v0.1.0 and v0.1.1 are out, you can now access component instances in the console and we've fixed a bug around Alpine version detection is not latest and upgrade to Alpine.js 2.8.0. For Chrome and Firefox (by @hugo__df).
ta-youtube by @markusantonwolf is now available as a TailwindCSS plugin on npm, @markusantonwolf/ta-youtube
.
v2.8.0
Feature:
- better evaluation error message (it's actually a console.warn so make sure you don't supress those)
Fix:
- adjacent
x-for
templates were sharing DOM nodes
Adopter Reactions
Refactoring Vue components into @Alpine_JS has become my new favorite pastime. Deleting whole files of code is so much more satisfying than writing them in the first place.
β Cameron Scott (@CameronHScott) December 12, 2020
Good luck to @joelvarty for his JAMstack Lagos presentation.
Delighted to be speaking about @eleven_ty, @tailwindcss and @Alpine_JS at the #JAMstack Lagos meetup. The attendees will be thousands of miles away, but they are all close to my heart. β€οΈ
I love technology
β Joel Varty (@joelvarty) December 11, 2020