title: JavaScript/Vuex 'this' transpiles to 'undefined'
body: <p>So this is my Vuex action, which calls my plugin $errorToast with this._vm:</p>
  
  <pre><code>activateCoupon: (context, id) =&gt; {
      return new Promise((resolve, reject) =&gt; {
         api.activateCoupon({id: id}).then(
             (response) =&gt; {
                 if(response.success){
                     context.commit('RESET_CART');
                     context.commit('SET_COUPON', response.body.data.coupon);
                     resolve(response); 
                 }else{
                      this._vm.$errorToast.show(resBody.code);
                      reject(response);
                 }
             },
             (error) =&gt; {
                  this._vm.$errorToast.show(error.body.code);
                  reject(error);
             }
         );
      });  
  }
  </code></pre>
  
  <p>but somehow it transpiles to this: (this => undefined)</p>
  
  <pre><code>activateCoupon: function activateCoupon(context, id) {
      return new Promise(function (resolve, reject) {
          _api2.default.activateCoupon({ id: id }).then(function (response) {
              if (response.success) {
                  context.commit('RESET_CART');
                  context.commit('SET_COUPON', response.body.data.coupon);
                  resolve(response);
              } else {
                  undefined._vm.$errorToast.show(resBody.code);
                  reject(response);
              }
          }, function (error) {
              undefined._vm.$errorToast.show(error.body.code);
              reject(error);
          });
      });
  },
  </code></pre>
  
  <p>The weird thing is that i am using the same approach for my other VuexStore.   And in the other Store 'this' becomes '_this8'.<br>
  I am using Laravel-Mix for compiling.  </p>