<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Cedric van Putten</title>
    <description>The latest articles on DEV Community by Cedric van Putten (@bycedric).</description>
    <link>https://dev.to/bycedric</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F122059%2F47988cf2-0c94-460c-84f4-684e545fb7cf.jpeg</url>
      <title>DEV Community: Cedric van Putten</title>
      <link>https://dev.to/bycedric</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/bycedric"/>
    <language>en</language>
    <item>
      <title>Simplify Expo releases with Standard Version</title>
      <dc:creator>Cedric van Putten</dc:creator>
      <pubDate>Wed, 15 Jan 2020 19:58:11 +0000</pubDate>
      <link>https://dev.to/bycedric/simplify-expo-releases-with-standard-version-2f4o</link>
      <guid>https://dev.to/bycedric/simplify-expo-releases-with-standard-version-2f4o</guid>
      <description>&lt;p&gt;Releasing your apps &lt;em&gt;can&lt;/em&gt; be a repetitive, sometimes even annoying task. You prepared and built your app for the stores, only to find out you forgot to bump a version code. If you don't like to do this, the great people from &lt;a href="http://github.com/conventional-changelog"&gt;Conventional Changelog&lt;/a&gt; got just the thing for you!&lt;/p&gt;

&lt;p&gt;Standard version is a tool to simplify the release process with a single command, &lt;code&gt;yarn standard-version&lt;/code&gt;. It's customizable and should have everything you need, like generated changelogs from &lt;a href="https://www.conventionalcommits.org/en/v1.0.0/"&gt;conventional commits&lt;/a&gt;. If you don't know the tool yet, &lt;a href="https://github.com/conventional-changelog/standard-version#standard-version"&gt;check out the documentation first&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;In this guide, I'll show you how to configure &lt;a href="https://github.com/expo-community/standard-version-expo#readme"&gt;Standard version for Expo&lt;/a&gt;. We will set up an example project and configure it for automated &lt;code&gt;expo.version&lt;/code&gt;, &lt;code&gt;expo.android.versionCode&lt;/code&gt; and &lt;code&gt;expo.ios.buildNumber&lt;/code&gt;.&lt;/p&gt;

&lt;h2&gt;
  
  
  🚀 Let's get going
&lt;/h2&gt;

&lt;p&gt;First things first, create an empty Expo project using the blank template.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight shell"&gt;&lt;code&gt;&lt;span class="nv"&gt;$ &lt;/span&gt;expo init &lt;span class="nt"&gt;--template&lt;/span&gt; blank
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;p&gt;Next, we need to define a starting version for our project. Standard version uses the &lt;a href="https://docs.npmjs.com/files/package.json#version"&gt;&lt;code&gt;package.json&lt;/code&gt;'s &lt;code&gt;version&lt;/code&gt;&lt;/a&gt; property to determine the current version. This value is used to calculate the next release. Let's set this property to &lt;code&gt;0.0.0&lt;/code&gt;.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight json"&gt;&lt;code&gt;&lt;span class="p"&gt;{&lt;/span&gt;&lt;span class="w"&gt;
  &lt;/span&gt;&lt;span class="nl"&gt;"version"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="s2"&gt;"0.0.0"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="w"&gt;
  &lt;/span&gt;&lt;span class="nl"&gt;"main"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="s2"&gt;"node_modules/expo/AppEntry.js"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="w"&gt;
  &lt;/span&gt;&lt;span class="err"&gt;...&lt;/span&gt;&lt;span class="w"&gt;
&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="w"&gt;
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;p&gt;Now add Standard version, with the Expo extension, to our dev dependencies.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight shell"&gt;&lt;code&gt;&lt;span class="nv"&gt;$ &lt;/span&gt;yarn add &lt;span class="nt"&gt;--dev&lt;/span&gt; standard-version@next standard-version-expo
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;blockquote&gt;
&lt;p&gt;Currently, &lt;a href="https://github.com/conventional-changelog/standard-version/issues/507#issuecomment-565806449"&gt;standard-version@7.1.0&lt;/a&gt; is the only version that supports updaters from packages. That's why we need &lt;code&gt;@next&lt;/code&gt; here.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;You can test the project by running standard-version in dry-run mode. This mode only tells what it will do without doing anything.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight shell"&gt;&lt;code&gt;&lt;span class="nv"&gt;$ &lt;/span&gt;yarn standard-version &lt;span class="nt"&gt;--dry-run&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;blockquote&gt;
&lt;p&gt;If you get the &lt;code&gt;Invalid Version: undefined&lt;/code&gt; error, it means the &lt;code&gt;package.json&lt;/code&gt; doesn't have a starting version.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;h3&gt;
  
  
  ⚙️ Configure Standard version
&lt;/h3&gt;

&lt;p&gt;Now that we've set up the basics, we need to configure Standard version for Expo. Create a file named &lt;code&gt;.versionrc.js&lt;/code&gt; with:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="nx"&gt;module&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;exports&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="na"&gt;bumpFiles&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;
    &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="na"&gt;filename&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;package.json&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
    &lt;span class="p"&gt;},&lt;/span&gt;
    &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="na"&gt;filename&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;app.json&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
      &lt;span class="na"&gt;updater&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;require&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;resolve&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;standard-version-expo&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;),&lt;/span&gt;
    &lt;span class="p"&gt;},&lt;/span&gt;
  &lt;span class="p"&gt;],&lt;/span&gt;
&lt;span class="p"&gt;};&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;blockquote&gt;
&lt;p&gt;This tells Standard version that we want to update &lt;code&gt;app.json&lt;/code&gt;, using the default updater from the Expo extension. The updater bumps &lt;code&gt;expo.version&lt;/code&gt; with the new version, so you don't have to! 😬 &lt;/p&gt;

&lt;p&gt;Note: We also want to update our &lt;code&gt;package.json&lt;/code&gt;, with the default updater, to keep a single source of truth for our versions. (See &lt;a href="https://github.com/expo-community/standard-version-expo/pull/3"&gt;PR #3&lt;/a&gt; for more details)&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;Test your configuration again with &lt;code&gt;--dry-run&lt;/code&gt;, if you see the following output, you did an excellent job. 🦄&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight shell"&gt;&lt;code&gt;&lt;span class="nv"&gt;$ &lt;/span&gt;yarn standard-version &lt;span class="nt"&gt;--dry-run&lt;/span&gt;

✔ bumping version &lt;span class="k"&gt;in &lt;/span&gt;app.json from 1.0.0 to 0.0.1
✔ created CHANGELOG.md
✔ outputting changes to CHANGELOG.md
...
✔ committing app.json and CHANGELOG.md
✔ tagging release v0.0.1
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;p&gt;Now commit these changes and create a new minor version.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight shell"&gt;&lt;code&gt;&lt;span class="nv"&gt;$ &lt;/span&gt;git add &lt;span class="nb"&gt;.&lt;/span&gt;
&lt;span class="nv"&gt;$ &lt;/span&gt;git commit &lt;span class="nt"&gt;-m&lt;/span&gt; &lt;span class="s1"&gt;'feat: add standard version for releases'&lt;/span&gt;
&lt;span class="nv"&gt;$ &lt;/span&gt;yarn standard-version &lt;span class="nt"&gt;--release-as&lt;/span&gt; minor
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;p&gt;After running the tool, you should have a new &lt;code&gt;CHANGELOG.md&lt;/code&gt; and an updated &lt;code&gt;app.json&lt;/code&gt; file! You still need to push the local changes to remote, but that also gives you an option to revert changes if something went wrong. 🧑‍🔧&lt;/p&gt;

&lt;h3&gt;
  
  
  📱 Configure build versions
&lt;/h3&gt;

&lt;p&gt;If you are planning on releasing your app to the stores, we need to configure Standard version a bit more. It also needs to update the &lt;a href="https://docs.expo.io/versions/latest/workflow/configuration/#android"&gt;Android version codes&lt;/a&gt; and &lt;a href="https://docs.expo.io/versions/latest/workflow/configuration/#ios"&gt;iOS build numbers&lt;/a&gt;. Let's start by updating our manifest with iOS and Android configuration.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight json"&gt;&lt;code&gt;&lt;span class="p"&gt;{&lt;/span&gt;&lt;span class="w"&gt;
  &lt;/span&gt;&lt;span class="nl"&gt;"expo"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="p"&gt;{&lt;/span&gt;&lt;span class="w"&gt;
    &lt;/span&gt;&lt;span class="err"&gt;...&lt;/span&gt;&lt;span class="w"&gt;
    &lt;/span&gt;&lt;span class="nl"&gt;"ios"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="p"&gt;{&lt;/span&gt;&lt;span class="w"&gt;
      &lt;/span&gt;&lt;span class="nl"&gt;"supportsTablet"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="kc"&gt;true&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="w"&gt;
      &lt;/span&gt;&lt;span class="nl"&gt;"bundleIdentifier"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="s2"&gt;"com.bycedric.awesomeapp"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="w"&gt;
      &lt;/span&gt;&lt;span class="nl"&gt;"buildNumber"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="s2"&gt;"0.0.0"&lt;/span&gt;&lt;span class="w"&gt;
    &lt;/span&gt;&lt;span class="p"&gt;},&lt;/span&gt;&lt;span class="w"&gt;
    &lt;/span&gt;&lt;span class="nl"&gt;"android"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="p"&gt;{&lt;/span&gt;&lt;span class="w"&gt;
      &lt;/span&gt;&lt;span class="nl"&gt;"package"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="s2"&gt;"com.bycedric.awesomeapp"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="w"&gt;
      &lt;/span&gt;&lt;span class="nl"&gt;"versionCode"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="w"&gt;
    &lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="w"&gt;
  &lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="w"&gt;
&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="w"&gt;

&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;p&gt;Great, now we need to tell Standard version about these new properties. The values should change on every release, just like our &lt;code&gt;expo.version&lt;/code&gt;. To do this, open up &lt;code&gt;.versionrc.js&lt;/code&gt; and add the new version bumpers.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="nx"&gt;module&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;exports&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="na"&gt;bumpFiles&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;
    &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="na"&gt;filename&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;package.json&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
    &lt;span class="p"&gt;},&lt;/span&gt;
    &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="na"&gt;filename&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;app.json&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
      &lt;span class="na"&gt;updater&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;require&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;resolve&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;standard-version-expo&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;),&lt;/span&gt;
    &lt;span class="p"&gt;},&lt;/span&gt;
    &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="na"&gt;filename&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;app.json&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
      &lt;span class="na"&gt;updater&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;require&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;resolve&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;standard-version-expo/android&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;),&lt;/span&gt;
    &lt;span class="p"&gt;},&lt;/span&gt;
    &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="na"&gt;filename&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;app.json&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
      &lt;span class="na"&gt;updater&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;require&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;resolve&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;standard-version-expo/ios&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;),&lt;/span&gt;
    &lt;span class="p"&gt;},&lt;/span&gt;
  &lt;span class="p"&gt;],&lt;/span&gt;
&lt;span class="p"&gt;};&lt;/span&gt;

&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;blockquote&gt;
&lt;p&gt;There are multiple types of version updaters, each with their own "tactic". You can &lt;a href="https://github.com/expo-community/standard-version-expo#usage"&gt;find them all here&lt;/a&gt;. For simplicity, let's stick to the recommended bumpers for now. &lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;That's it! If you commit these changes and run Standard version, it will update the build version numbers for you too. 🌈&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight shell"&gt;&lt;code&gt;&lt;span class="nv"&gt;$ &lt;/span&gt;git add &lt;span class="nb"&gt;.&lt;/span&gt;
&lt;span class="nv"&gt;$ &lt;/span&gt;git commit &lt;span class="nt"&gt;-m&lt;/span&gt; &lt;span class="s1"&gt;'feat: add standard version for releases'&lt;/span&gt;
&lt;span class="nv"&gt;$ &lt;/span&gt;yarn standard-version &lt;span class="nt"&gt;--release-as&lt;/span&gt; patch
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;h2&gt;
  
  
  🤝 Thanks for reading!
&lt;/h2&gt;

&lt;p&gt;I hope this can be useful for anyone. If you use this library, feel free to reach out. I'd love to hear about your experiences with the tool. Also, feel free to reach out if you have great ideas to make it better or if you are stuck. 🙆‍♂️&lt;/p&gt;

&lt;h2&gt;
  
  
  📚 Extra goodies
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;Join the &lt;a href="https://slack.expo.io/"&gt;Expo Developers slack&lt;/a&gt; for Expo related stuff.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Join the &lt;a href="https://devtoolscommunity.herokuapp.com/"&gt;Node Tooling slack&lt;/a&gt; for Standard version or Conventional Commits stuff.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Read more about &lt;a href="https://github.com/conventional-changelog/standard-version"&gt;Standard Version&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Find out everything about the &lt;a href="https://github.com/expo-community/standard-version-expo"&gt;Standard Version Expo&lt;/a&gt; integration&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;blockquote&gt;
&lt;p&gt;Edit: I made a mistake of not adding &lt;code&gt;package.json&lt;/code&gt; to our &lt;code&gt;.versionrc.js&lt;/code&gt;. Thanks to &lt;a href="https://github.com/expo-community/standard-version-expo/pull/3"&gt;awinograd&lt;/a&gt; for spotting and fixing it!&lt;/p&gt;

&lt;p&gt;Cover photo by &lt;a href="https://unsplash.com/@___rob__?utm_source=unsplash&amp;amp;utm_medium=referral&amp;amp;utm_content=creditCopyText"&gt;Robert Metz&lt;/a&gt;&lt;/p&gt;
&lt;/blockquote&gt;

</description>
      <category>expo</category>
      <category>beginners</category>
      <category>tutorial</category>
      <category>version</category>
    </item>
  </channel>
</rss>
