Improve build times by adding node-sass and dev config setup

half5cat · Apr 12, 2018 · 7bbc244 · 7bbc244
1 parent 8077586
commit 7bbc244
Show file tree

Hide file tree

Showing 8 changed files with 4,549 additions and 8 deletions.
diff --git a/.gitignore b/.gitignore
@@ -2,3 +2,7 @@ _site/
 .sass-cache/
 .jekyll-metadata
 .DS_Store
+assets/css
+node_modules
+*.swp
+_config_dev.yml
diff --git a/_config.yml b/_config.yml
@@ -23,6 +23,9 @@ sass:
   style: compressed
 include: ['_pages']
 
+# Current site environment
+environment: production
+
 collections:
     examples:
         output: true

diff --git a/_includes/css.html b/_includes/css.html
@@ -0,0 +1,5 @@
+{% if site.environment == 'dev' %}
+    <link rel="stylesheet" href="/assets/css/main.css" />
+{% else %}
+    <style>{% include main.css %}</style>
+{% endif %}
diff --git a/_includes/head.html b/_includes/head.html
@@ -6,14 +6,8 @@
   <title>{% if page.title %}{{ page.title }}{% else %}{{ site.title }}{% endif %}</title>
   <meta name="description" content="{% if page.overview %}{{ page.overview | strip_html | strip_newlines | truncate: 160 }}{% else %}{{ site.description }}{% endif %}">
 
-  <style>
-      {% capture include_to_scssify %}
-        {% include main.scss %}
-      {% endcapture %}
-      {{ include_to_scssify | scssify }}
-    </style>
-
-    {% seo %}
+  {% include css.html %}
+  {% seo %}
 
   <meta property="og:image" content="https://principles.design/images/design-principles-og.png">
   <meta name="twitter:image:src" content="https://principles.design/images/design-principles-og.png">

diff --git a/_includes/main.css b/_includes/main.css
diff --git a/_includes/main.scss → _sass/main.scss b/_includes/main.scss → _sass/main.scss