React Invariant Violation / Minified Exception on iOS 8 with Webpack + Babel

TL;DR

Check out this gist to see the bug.

I ran into a head-scratcher over the weekend that I needed document, because I spent a few more hours than I wanted to trying to see why a deployed project wasn’t working at all on iOS 8.4.

My project is using react, webpack, and babel. One of the babel plugins I’m using is babel-plugin-transform-react-inline-elements which transforms react elements to increase performance in production.

I’m also using the babel-polyfill (which includes the core-js shim) to polyfill some features like Symbols.

The project was working fine locally on iOS 8, but when deployed I was getting an error from react.

Read more

Greenkeeper

Over the course of ~36 hours last weekend greenkeeper notified me of two of my projects where the build was broken by minor updates to tools…

Read more

npm@3: What Ends Up at the Top of node_modules with Conflicting Dependencies?

npm@3 has been stable for a few months now and one the big changes was the new flat(ter) directory structure inside node_modules. This blog post has a good writeup of why that’s a good thing.

You’ll notice that I said “flat(ter)” above. If two modules in your project have conflicting dependencies, then one of those will end up on the top level of node_modules and the other will be nested inside its parent’s node_modules directory. This got me to wondering, which ones ends up on the top level?

I was wondering this because of a discussion on the eslint issue tracker about if the new directory structure will allow you to require a nested dependency now that it is at the top level of node_modules. As the linked comment pointed out, it will let you, but that doesn’t mean you should do it. If you did depend on this functionality, you would be requiring a module without any guarantee of what version you would be getting back.

Read more

Secret Santa over SMS with Twilio

Update 11/29/21

This project is still alive but the instructions in this blog post are out of date. Visit the GitHub repo for the latest instructions on how to run it.

TL;DR

Use this code to pick Secret Santas over SMS with Twilio.

My family does a sibling Secret Santa (plus spouses) every year. We live in a few different cities, and we forgot to do it on Thanksgiving so we were out of luck as far as picking in person. My sisters know what I do for a living so they joked over text that I should “write a code”. (Software is truly eating the world.)

I knew there were services out there to do remote Secret Santa, but they were all over email. I knew everyone’s phone number and I knew that they would check their texts far more often than their email, so I really wanted something to deliver the recipients over SMS.

I found a Ruby script out there to do the same thing, but I wanted some additional logic and its been a few years since I wrote Ruby, plus I’ve always wanted to play around with Twilio. Sounds like a recipe for a nice Saturday project.

Read more

ES6 Arrow Function Stack Traces

Since I started writing ES6, I’ve adopted the functions without function approach and have quite liked it.

I’m not going to get into every reason why, but that post does a good job of echoing my thoughts on it. I’m not going so far as to say “never”, but I don’t think I’ve found the need to type the word function even once since I started writing ES6.

I have always wondered about stack traces when using arrow functions though.

Read more