无法分配给对象“#<Object>”VueJs 的只读属性“exports”

Car*_*llo 5 javascript class webpack vue.js babeljs

我正在使用 Webpack 和 Babel 开发一个 Vue 项目,并尝试从一个带有 module.exports 的单个文件中导出两个 Js 类,并将其包含在具有如下要求的组件中:

类.js

class classOne {
  constructor(){
  }
  f1() {}
  f2() {}
  ...
}
class classTwo {
  constructor(){
  }
  f1() {}
  f2() {}
  ...
}
module.exports = {
  classOne,
  classTwo
}
Run Code Online (Sandbox Code Playgroud)

component.vue 的 script 标签

const classes = require('@/path/to/classes.js');

export default {
  data() {
    return {
      var: undefined,
      foo: undefined,
    }
  }
  created() {
    this.var = new classes.classOne();
    this.foo = new classes.classTwo();
  }
}
Run Code Online (Sandbox Code Playgroud)

但我收到此错误:

Uncaught TypeError: Cannot assign to read only property 'exports' of object '#<Object>'
Run Code Online (Sandbox Code Playgroud)