Set up babel

colebemis · colebemis · commit 9cbd7ca24d6c · 2017-01-28T14:46:21.000-08:00
diff --git a/.babelrc b/.babelrc
@@ -0,0 +1,5 @@
+{
+  "presets": [
+    ["es2015", {"modules": false}]
+  ]
+}
diff --git a/bundle.js b/bundle.js
@@ -70,13 +70,8 @@
 /* 0 */
 /***/ (function(module, exports) {
 
-const data = {
-  icons: [
-    'square',
-    'circle',
-    'rectangle-vertical',
-    'rectangle-horizontal'
-  ]
+var data = {
+  icons: ['square', 'circle', 'rectangle-vertical', 'rectangle-horizontal']
 };
 
 Vue.component('icon', {
@@ -91,26 +86,25 @@ Vue.component('icon', {
     }
   },
   template: '#icon-template',
-  mounted() {
-    fetch(`./icons/${this.name}.svg`)
-      .then(response => {
-        if (response.ok) {
-          return response.text();
-        }
-        throw new Error(`Cannot find ${this.name}.svg`);
-      })
-      .then(svgText => {
-        const svgDocument = new DOMParser().parseFromString(svgText, 'image/svg+xml');
-        const svgIcon = svgDocument.querySelector('svg').cloneNode(true);
-
-        svgIcon.setAttribute('width', this.size);
-        svgIcon.setAttribute('height', this.size);
-
-        this.$el.appendChild(svgIcon);
-      })
-      .catch(error => {
-        console.error(error);
-      });
+  mounted: function mounted() {
+    var _this = this;
+
+    fetch('./icons/' + this.name + '.svg').then(function (response) {
+      if (response.ok) {
+        return response.text();
+      }
+      throw new Error('Cannot find ' + _this.name + '.svg');
+    }).then(function (svgText) {
+      var svgDocument = new DOMParser().parseFromString(svgText, 'image/svg+xml');
+      var svgIcon = svgDocument.querySelector('svg').cloneNode(true);
+
+      svgIcon.setAttribute('width', _this.size);
+      svgIcon.setAttribute('height', _this.size);
+
+      _this.$el.appendChild(svgIcon);
+    }).catch(function (error) {
+      console.error(error);
+    });
   }
 });
 
@@ -122,7 +116,7 @@ Vue.component('icon-container', {
     }
   },
   template: '#icon-container-template'
-})
+});
 
 new Vue({
   el: '#app',
diff --git a/package.json b/package.json
@@ -2,6 +2,9 @@
   "name": "feather",
   "version": "0.0.0",
   "devDependencies": {
+    "babel-core": "^6.22.1",
+    "babel-loader": "^6.2.10",
+    "babel-preset-es2015": "^6.22.0",
     "webpack": "^2.2.0"
   }
 }
diff --git a/webpack.config.js b/webpack.config.js
@@ -5,5 +5,14 @@ module.exports = {
   output: {
     path: path.resolve(__dirname),
     filename: 'bundle.js'
+  },
+  module: {
+    rules: [
+      {
+        test: /\.js$/,
+        loader: 'babel-loader',
+        exclude: /node_modules/
+      }
+    ]
   }
 }

-Original file line number
+Diff line change
@@ @@ -0,0 +1,5 @@ @@
 +{
 +  "presets": [
 +    ["es2015", {"modules": false}]
 +  ]
 +}
Original file line number	Diff line number	Diff line change
`@@ -2,6 +2,9 @@`
`2`	`2`	`"name": "feather",`
`3`	`3`	`"version": "0.0.0",`
`4`	`4`	`"devDependencies": {`
	`5`	`+ "babel-core": "^6.22.1",`
	`6`	`+ "babel-loader": "^6.2.10",`
	`7`	`+ "babel-preset-es2015": "^6.22.0",`
`5`	`8`	`"webpack": "^2.2.0"`
`6`	`9`	`}`
`7`	`10`	`}`