From 9a0aa08810e24b4ef2315d2bb38871f3bb78f1bf Mon Sep 17 00:00:00 2001
From: Andrew Watkins <watts@influxdb.com>
Date: Tue, 27 Sep 2016 11:07:17 -0700
Subject: [PATCH] Allow import of static png and jpg in scss

---
 ui/assets/images/laser-spinner.png               | Bin 0 -> 6678 bytes
 ui/package.json                                  |   1 +
 .../chronograf/components/_Visualization.scss    |   6 +++---
 ui/src/style/enterprise_style/application.scss   |   2 +-
 ui/webpack/devConfig.js                          |   7 +++----
 5 files changed, 8 insertions(+), 8 deletions(-)
 create mode 100644 ui/assets/images/laser-spinner.png

diff --git a/ui/assets/images/laser-spinner.png b/ui/assets/images/laser-spinner.png
new file mode 100644
index 0000000000000000000000000000000000000000..5287a82c6df41e1ce5da66e47211870a3daedee5
GIT binary patch
literal 6678
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

literal 0
HcmV?d00001

diff --git a/ui/package.json b/ui/package.json
index b2c55a86e9..3bd3af5f68 100644
--- a/ui/package.json
+++ b/ui/package.json
@@ -99,6 +99,7 @@
     "react-sparklines": "^1.4.2",
     "redux": "^3.3.1",
     "redux-thunk": "^1.0.3",
+    "resolve-url-loader": "^1.6.0",
     "updeep": "^0.13.0"
   }
 }
diff --git a/ui/src/style/chronograf/components/_Visualization.scss b/ui/src/style/chronograf/components/_Visualization.scss
index 955c6ee832..21e6e4c081 100644
--- a/ui/src/style/chronograf/components/_Visualization.scss
+++ b/ui/src/style/chronograf/components/_Visualization.scss
@@ -130,7 +130,7 @@ $dygraphs-legend-offset: 32px;
   &__spinner {
     width: 121px;
     height: 121px;
-    background-image: url(/assets/images/laser-spinner.png);
+    background-image: url(assets/images/laser-spinner.png);
     background-size: 100% 100%;
     background-position: center center;
     background-repeat: no-repeat;
@@ -139,7 +139,7 @@ $dygraphs-legend-offset: 32px;
   &__spinner--small {
     width: 38px;
     height: 38px;
-    background-image: url(/assets/images/laser-spinner.png);
+    background-image: url(assets/images/laser-spinner.png);
     background-size: 100% 100%;
     background-position: center center;
     background-repeat: no-repeat;
@@ -263,4 +263,4 @@ $dygraphs-legend-offset: 32px;
      font-weight: 600;
     }
   }
-}
\ No newline at end of file
+}
diff --git a/ui/src/style/enterprise_style/application.scss b/ui/src/style/enterprise_style/application.scss
index 45e48c5ebd..dd24795aca 100644
--- a/ui/src/style/enterprise_style/application.scss
+++ b/ui/src/style/enterprise_style/application.scss
@@ -18,4 +18,4 @@
 // components.  There's likely a better fix, but this does for now.
 @import '../_OverviewPage';
 @import '../chronograf/main';
-@import '../_SideNav';
\ No newline at end of file
+@import '../_SideNav';
diff --git a/ui/webpack/devConfig.js b/ui/webpack/devConfig.js
index a5452352ad..aee80b8cdb 100644
--- a/ui/webpack/devConfig.js
+++ b/ui/webpack/devConfig.js
@@ -36,16 +36,15 @@ module.exports = {
       },
       {
         test: /\.scss$/,
-        //loader: 'style!css!sass',
-        loader: ExtractTextPlugin.extract('style-loader', 'css-loader!sass-loader'),
+        loader: ExtractTextPlugin.extract('style-loader', 'css-loader!sass-loader!resolve-url!sass?sourceMap'),
       },
       {
         test: /\.css$/,
         loader: ExtractTextPlugin.extract('style-loader', 'css-loader!postcss-loader'),
       },
       {
-        test   : /\.(ttf|eot|svg|woff(2)?)(\?[a-z0-9]+)?$/,
-        loader : 'file-loader',
+        test   : /\.(png|jpg|ttf|eot|svg|woff(2)?)(\?[a-z0-9]+)?$/,
+        loader : 'file',
       },
       {
         test: /\.js$/,