From 0f793ca7f1c4a18535186c5d0a5d8918f09e7487 Mon Sep 17 00:00:00 2001
From: Jono Lee <jono-lee@hotmail.co.uk>
Date: Sun, 10 Dec 2017 09:37:43 +0000
Subject: [PATCH 1/2] :code prop being reactive

---
 package.json   |  2 +-
 src/Monaco.vue | 11 +++++++++--
 2 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/package.json b/package.json
index e5aab37..14849b4 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "vue-monaco-editor",
   "description": "Monaco Editor Component for Vue.js 2.x",
-  "version": "0.0.18",
+  "version": "0.0.19",
   "author": "matt-oconnell <mattoconnell408@gmail.com>",
   "main": "index.js",
   "private": false,
diff --git a/src/Monaco.vue b/src/Monaco.vue
index 41d3047..4be84b7 100644
--- a/src/Monaco.vue
+++ b/src/Monaco.vue
@@ -64,8 +64,11 @@ module.exports = {
       },
       deep: true
     },
-    language () {
-      window.monaco.editor.setModelLanguage(this.editor.getModel(), this.language)
+    code(value) {
+      if (this.editor.getValue() !== value) {
+        this.codePropChange = true
+        this.editor.setValue(value)
+      }
     }
   },
   methods: {
@@ -101,6 +104,10 @@ module.exports = {
       this.$emit('mounted', editor);
     },
     codeChangeHandler: function(editor) {
+      if (this.codePropChange) {
+        this.codePropChange = false
+        return
+      }
       if (this.codeChangeEmitter) {
         this.codeChangeEmitter(editor);
       } else {

From ee8fdf755073befe3cb8b6bda14354829c2a9358 Mon Sep 17 00:00:00 2001
From: Jono Lee <jono-lee@hotmail.co.uk>
Date: Sun, 10 Dec 2017 10:44:59 +0000
Subject: [PATCH 2/2] upgrade packages

---
 .babelrc          |  2 +-
 package.json      | 25 ++++++++++++-------------
 src/App.vue       |  4 ++--
 src/Monaco.vue    | 10 +++++-----
 webpack.config.js |  6 +++---
 5 files changed, 23 insertions(+), 24 deletions(-)

diff --git a/.babelrc b/.babelrc
index 9897749..3ed94df 100644
--- a/.babelrc
+++ b/.babelrc
@@ -1,5 +1,5 @@
 {
   "presets": [
-    ["es2015", { "modules": false }]
+    ["env", { "modules": false }]
   ]
 }
diff --git a/package.json b/package.json
index 14849b4..c3029cc 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "vue-monaco-editor",
   "description": "Monaco Editor Component for Vue.js 2.x",
-  "version": "0.0.19",
+  "version": "0.0.20",
   "author": "matt-oconnell <mattoconnell408@gmail.com>",
   "main": "index.js",
   "private": false,
@@ -26,19 +26,18 @@
   },
   "dependencies": {
     "lodash.debounce": "^4.0.8",
-    "vue": "^2.1.0"
+    "vue": "^2.5.9"
   },
   "devDependencies": {
-    "babel-core": "^6.0.0",
-    "babel-loader": "^6.0.0",
-    "babel-preset-es2015": "^6.0.0",
-    "cross-env": "^3.0.0",
-    "css-loader": "^0.25.0",
-    "file-loader": "^0.9.0",
-    "vue-loader": "^10.0.0",
-    "vue-template-compiler": "^2.1.0",
-    "vueify": "^9.4.0",
-    "webpack": "^2.1.0-beta.25",
-    "webpack-dev-server": "^2.1.0-beta.9"
+    "babel-core": "^6.26.0",
+    "babel-loader": "^7.1.2",
+    "babel-preset-env": "^1.6.1",
+    "cross-env": "^5.1.1",
+    "css-loader": "^0.28.7",
+    "file-loader": "^1.1.5",
+    "vue-loader": "^13.5.0",
+    "vueify": "^9.4.1",
+    "webpack": "^3.10.0",
+    "webpack-dev-server": "^2.9.7"
   }
 }
diff --git a/src/App.vue b/src/App.vue
index 7b84aa1..ab12178 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -34,9 +34,9 @@
 </template>
 
 <script>
-const Monaco = require('./Monaco.vue')
+import Monaco from './Monaco.vue'
 
-module.exports = {
+export default {
   components: {
     Monaco
   },
diff --git a/src/Monaco.vue b/src/Monaco.vue
index 4be84b7..63923df 100644
--- a/src/Monaco.vue
+++ b/src/Monaco.vue
@@ -3,10 +3,10 @@
 </template>
 
 <script>
-var debounce = require('lodash.debounce');
-var monacoLoader = require('./MonacoLoader');
+import debounce from 'lodash.debounce'
+import monacoLoader from './MonacoLoader'
 
-module.exports = {
+export default {
   props: {
     width: { type: [String, Number], default: '100%' },
     height: { type: [String, Number], default: '100%' },
@@ -65,7 +65,7 @@ module.exports = {
       deep: true
     },
     code(value) {
-      if (this.editor.getValue() !== value) {
+      if (this.editor && this.editor.getValue() !== value) {
         this.codePropChange = true
         this.editor.setValue(value)
       }
@@ -103,7 +103,7 @@ module.exports = {
       );
       this.$emit('mounted', editor);
     },
-    codeChangeHandler: function(editor) {
+    codeChangeHandler(editor) {
       if (this.codePropChange) {
         this.codePropChange = false
         return
diff --git a/webpack.config.js b/webpack.config.js
index 317bea2..3590579 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -20,7 +20,7 @@ module.exports = {
             // the "scss" and "sass" values for the lang attribute to the right configs here.
             // other preprocessors should work out of the box, no loader config like this nessessary.
             'scss': 'vue-style-loader!css-loader!sass-loader',
-            'sass': 'vue-style-loader!css-loader!sass-loader?indentedSyntax'
+            'sass': 'vue-style-loader!css-loader!sass-loader?indentedSyntax'            
           }
           // other vue-loader options go here
         }
@@ -51,11 +51,11 @@ module.exports = {
   performance: {
     hints: false
   },
-  devtool: '#eval-source-map'
+  devtool: 'eval-source-map'
 }
 
 if (process.env.NODE_ENV === 'production') {
-  module.exports.devtool = '#source-map'
+  module.exports.devtool = 'source-map'
   // http://vue-loader.vuejs.org/en/workflow/production.html
   module.exports.plugins = (module.exports.plugins || []).concat([
     new CopyWebpackPlugin([