Upgrading to 2.3.0 from 2.2.x

Author: tannerhodges

public/getting_started.html

@@ -167,6 +167,44 @@ <h3><a class="styleguide" href="http://csswizardry.com/2015/03/more-transparent-
 </ul>
 <h1 id="upgrade_guide" class="styleguide">Upgrade Guide</h1>
 
+<h2>Upgrading to 2.3.0 from 2.2.x</h2>
+<p class="styleguide">Estimated upgrade time: 1–2 hours</p>
+<h3>Switching from <a class="styleguide" href="https://github.com/brigade/scss-lint" title="https://github.com/brigade/scss-lint">scss-lint</a> to <a class="styleguide" href="https://stylelint.io" title="https://stylelint.io">stylelint</a></h3>
+
+<h4>Uninstall scss-lint</h4>
+<ul class="styleguide"><li><code class="styleguide">gem uninstall scss_lint</code></li>
+<li>Sublime Text &gt; Package Control: Remove Package &gt; SublimeLinter-contrib-scsslint</li>
+</ul>
+<h4>Install stylelint</h4>
+<ul class="styleguide"><li><code class="styleguide">npm install -g stylelint</code></li>
+<li>Install SublimeLinter packages*:
+<ul class="styleguide"><li>Sublime Text &gt; Package Control: Install Package &gt; SublimeLinter</li>
+<li>Sublime Text &gt; Package Control: Install Package &gt; SublimeLinter-contrib-stylelint</li>
+</ul></li>
+</ul><p class="styleguide">*Plugins for other text editors are listed <a class="styleguide" href="https://stylelint.io/user-guide/complementary-tools/#editor-plugins" title="https://stylelint.io/user-guide/complementary-tools/#editor-plugins">here</a>.</p><p class="styleguide">To automatically lint and show errors when you save a file:</p><ul class="styleguide"><li>Sublime Text &gt; Preferences &gt; Package Settings &gt; SublimeLinter &gt; Settings - User</li>
+<li>Add these options:</li>
+</ul><div class="codeBlock">
+  <div class="highlight">
+    <pre>{
+  "user": {
+    "lint_mode": "load/save",
+    "show_errors_on_save": true,
+  }
+}</pre>
+  </div>
+</div>
+<h4>Update project</h4>
+<div class="codeBlock">
+  <div class="highlight">
+    <pre>yarn upgrade mode-front-end
+yarn add stylelint-config-property-sort-order-smacss
+npm run init-config --prefix ./node_modules/mode-front-end
+rm -f .scss-lint.yml
+git add .scss-lint.yml &amp;&amp; git add .stylelintrc
+git checkout .
+git commit -m "Replace scss-lint with stylelint"</pre>
+  </div>
+</div>
 <h2>Upgrading to 2.2.0 from 2.1.x</h2>
 <p class="styleguide">Estimated upgrade time: 0.5 hour</p>
 <h3><code class="styleguide">u-object-fit()</code> Mixin</h3>

public/index.html

@@ -167,6 +167,44 @@ <h3><a class="styleguide" href="http://csswizardry.com/2015/03/more-transparent-
 </ul>
 <h1 id="upgrade_guide" class="styleguide">Upgrade Guide</h1>
 
+<h2>Upgrading to 2.3.0 from 2.2.x</h2>
+<p class="styleguide">Estimated upgrade time: 1–2 hours</p>
+<h3>Switching from <a class="styleguide" href="https://github.com/brigade/scss-lint" title="https://github.com/brigade/scss-lint">scss-lint</a> to <a class="styleguide" href="https://stylelint.io" title="https://stylelint.io">stylelint</a></h3>
+
+<h4>Uninstall scss-lint</h4>
+<ul class="styleguide"><li><code class="styleguide">gem uninstall scss_lint</code></li>
+<li>Sublime Text &gt; Package Control: Remove Package &gt; SublimeLinter-contrib-scsslint</li>
+</ul>
+<h4>Install stylelint</h4>
+<ul class="styleguide"><li><code class="styleguide">npm install -g stylelint</code></li>
+<li>Install SublimeLinter packages*:
+<ul class="styleguide"><li>Sublime Text &gt; Package Control: Install Package &gt; SublimeLinter</li>
+<li>Sublime Text &gt; Package Control: Install Package &gt; SublimeLinter-contrib-stylelint</li>
+</ul></li>
+</ul><p class="styleguide">*Plugins for other text editors are listed <a class="styleguide" href="https://stylelint.io/user-guide/complementary-tools/#editor-plugins" title="https://stylelint.io/user-guide/complementary-tools/#editor-plugins">here</a>.</p><p class="styleguide">To automatically lint and show errors when you save a file:</p><ul class="styleguide"><li>Sublime Text &gt; Preferences &gt; Package Settings &gt; SublimeLinter &gt; Settings - User</li>
+<li>Add these options:</li>
+</ul><div class="codeBlock">
+  <div class="highlight">
+    <pre>{
+  "user": {
+    "lint_mode": "load/save",
+    "show_errors_on_save": true,
+  }
+}</pre>
+  </div>
+</div>
+<h4>Update project</h4>
+<div class="codeBlock">
+  <div class="highlight">
+    <pre>yarn upgrade mode-front-end
+yarn add stylelint-config-property-sort-order-smacss
+npm run init-config --prefix ./node_modules/mode-front-end
+rm -f .scss-lint.yml
+git add .scss-lint.yml &amp;&amp; git add .stylelintrc
+git checkout .
+git commit -m "Replace scss-lint with stylelint"</pre>
+  </div>
+</div>
 <h2>Upgrading to 2.2.0 from 2.1.x</h2>
 <p class="styleguide">Estimated upgrade time: 0.5 hour</p>
 <h3><code class="styleguide">u-object-fit()</code> Mixin</h3>

resources/assets/sass/upgrade_guide.md

@@ -5,6 +5,52 @@ category: Getting Started
 hologram: true
 ---
 
+## Upgrading to 2.3.0 from 2.2.x
+
+Estimated upgrade time: 1–2 hours
+
+### Switching from [scss-lint](https://github.com/brigade/scss-lint) to [stylelint](https://stylelint.io)
+
+#### Uninstall scss-lint
+
+- `gem uninstall scss_lint`
+- Sublime Text > Package Control: Remove Package > SublimeLinter-contrib-scsslint
+
+#### Install stylelint
+
+- `npm install -g stylelint`
+- Install SublimeLinter packages*:
+    - Sublime Text > Package Control: Install Package > SublimeLinter
+    - Sublime Text > Package Control: Install Package > SublimeLinter-contrib-stylelint
+
+*Plugins for other text editors are listed [here](https://stylelint.io/user-guide/complementary-tools/#editor-plugins).
+
+To automatically lint and show errors when you save a file:
+
+- Sublime Text > Preferences > Package Settings > SublimeLinter > Settings - User
+- Add these options:
+
+```json
+{
+  "user": {
+    "lint_mode": "load/save",
+    "show_errors_on_save": true,
+  }
+}
+```
+
+#### Update project
+
+```
+yarn upgrade mode-front-end
+yarn add stylelint-config-property-sort-order-smacss
+npm run init-config --prefix ./node_modules/mode-front-end
+rm -f .scss-lint.yml
+git add .scss-lint.yml && git add .stylelintrc
+git checkout .
+git commit -m "Replace scss-lint with stylelint"
+```
+
 ## Upgrading to 2.2.0 from 2.1.x
 
 Estimated upgrade time: 0.5 hour