So recently, I've started to make the move off MacOS as my daily work driver and was trying to work solely on my Windows 10 Laptop (Razer Blade). Well, it was all fine and dandy with my sweet WSL2 setup, until I encountered an issue. There's no official instructions on how to use Shopify Slate properly on Linux.
In this post, I'd like to document my steps taken to properly get a local SSL setup while still following Shopify Slate's instructions with their ssl-check shell function they provide you.
Note: I've made a PR with documentation updates to the Shopify Slate repo!
- Follow all the Shopify Slate instructions up to the "Create a self-signed SSL certificate" step
- Once at this step, do the following:
- Install mkcert by following these instructions from the official mkcert repo
-
Add the following function to your shell profile (.bash_profile, .zshrc, .bashrc, etc...)
function ssl-check() { f=~/.localhost_ssl; ssl_crt=$f/server.crt ssl_key=$f/server.key b=$(tput bold) c=$(tput sgr0) local_ip=$(hostname -I | cut -d' ' -f1) # local_ip=999.999.999 # (uncomment for testing) domains=( "localhost" "$local_ip" ) if [[ ! -f $ssl_crt ]]; then echo -e "\n🛑 ${b}Couldn't find a Slate SSL certificate:${c}" make_key=true elif [[ ! $(openssl x509 -noout -text -in $ssl_crt | grep $local_ip) ]]; then echo -e "\n🛑 ${b}Your IP Address has changed:${c}" make_key=true else echo -e "\n✅ ${b}Your IP address is still the same.${c}" fi if [[ $make_key == true ]]; then echo -e "Generating a new Slate SSL certificate...\n" count=$(( ${#domains[@]} - 1)) mkcert ${domains[@]} # Create Slate's default certificate directory, if it doesn't exist test ! -d $f && mkdir $f # It appears mkcert bases its filenames off the number of domains passed after the first one. # This script predicts that filename, so it can copy it to Slate's default location. if [[ $count = 0 ]]; then mv ./localhost.pem $ssl_crt mv ./localhost-key.pem $ssl_key else mv ./localhost+$count.pem $ssl_crt mv ./localhost+$count-key.pem $ssl_key fi fi }
The biggest difference with this script is the
local_ip
assignment. The one that is in the official Slate Documentation only handles for MacOS. This should work for most Linux environments (tested on Ubuntu 16.04 - 19.10)
- Restart your terminal or run
source <location of your shell profile>
- Run
ssl-check
and then runmkcert -install
- You will need to restart your currently open browsers for these changes to take effect
You should now have a functioning local SSL setup for Shopify Slate. You can yarn start
your heart out!
Top comments (0)