Vuex 未捕获的语法错误和标识符

uncaught syntax error and identifier with Vuex

我正在学习 Vuex,但遇到了 运行 mapState 的挑战,我认为 mapGetters 和 mapMutations 也会遇到同样的挑战。

我正在 运行 在非节点环境中 xampp localhost 中设置代码,我不断收到类似

的错误
Uncaught SyntaxError: Unexpected token { 

下面是我的代码:

index.html

<script src="./vue.js"></script>
<!--<script src="./vuex.min.js"></script>-->

<div id="app">
  <counter></counter>
  <p>
    <button @click="increment">+</button>
    <button @click="decrement">-</button>
  </p>
</div>
<script src="./example.js"></script>

example.js

import { mapState } from './vuex.min';

const store = new Vuex.Store({
  state: {
    count: 0
  },
  mutations: {
    increment: state => state.count++,
    decrement: state => state.count--
  }
})

const Counter = {
  template: `<div>{{ count }}</div>`,
  /*computed: {
    count () {
      return this.$store.state.count
    }
  }*/
  computed:mapState({})

  /*
     I have inserted mapState this way

     though the example given is

     import { mapState } from 'vuex';

     export default {
        computed: mapState({
           //some codes here
        })
     }

  */

}

const app = new Vue({
  el: '#app',
  store,
  components: { Counter },
  methods: {
    increment () {
      store.commit('increment')
    },
    decrement () {
        store.commit('decrement')
    }
  }
})

我敢肯定肯定有什么地方出错了,或者还没有声明一些东西来让它工作,这就是我寻求帮助的原因;我已经尝试了很多方法甚至将 Vue devtool 扩展安装到 chrome 但无法启动 devtool 来启用我 运行 vue devtool 中的代码。

您不能从压缩(生产)构建中导出 ES6。您需要使用 Vuex.mapState()

导出

这是工作示例。

https://jsfiddle.net/exckyse3/