如何使用对象展开符 / mapState 帮助程序

Question

我正在尝试在Vue页面中映射我的存储状态变量：

<script>
    export default {
        data: () => ({
            localData: []

        }),
        computed: {  
            someLocalProperty: {
                get: function () {
                  // ....
                }
            },
            ...mapState({
                one: state => state.one,
                two: state => state.two,
                three: state => state.three, 
            })
        },                   
    };
</script>

然而，这个操作会出现以下错误：

   Uncaught Error: Module build failed: 
    71 :     data: () => ({
    72 :         localData: []
    73 : 
    74 :     }),
    75 :     computed: {

    Object spread operator requires specified objectAssign option with 'Object.assign' or polyfill helper. (75:14)

我做错了什么？

我尝试在我的webpack配置中添加objectAssign: 'Object.assign'，但没有帮助：

rules: [
      {
        test: /\.vue$/,
        loader: 'vue-loader',
        options: {
            objectAssign: 'Object.assign',
            preLoaders: {
            i18n: 'yaml-loader'
          },
          loaders: {
            i18n: '@kazupon/vue-i18n-loader'
          }
        }
      },
      {
        test: /\.js$/,
        loader: 'buble-loader',
        exclude: /node_modules/,
        options: {
          objectAssign: 'Object.assign'
        }
      },
      {
        test: /\.styl$/,
        loader: ['style-loader', 'css-loader', 'stylus-loader']
      },
      {
        test: /\.(eot|svg|ttf|woff|woff2)$/,
        loader: 'file-loader?name=public/fonts/[name].[ext]'
      }
    ]
  },

- netik

---

"对象展开运算符需要..." 啧啧，它们真是太调皮了。它不是一个运算符。:-) - T.J. Crowder

Answer 1

也许你的 buble-loader 配置有误？

查看 原始项目文档 中的这个片段：

module: {
  loaders: [
    {
      test: /.js$/,
      loaders: 'buble',
      include: path.join(__dirname, 'src'),
      query: {
        objectAssign: 'Object.assign'
      }
    }
  ]
}

- totev