javascript - 由于导入顺序，Backbone View 不是 Webpack 中的构造函数错误

Question

我在 1 个文件中有一个主干 View ，我试图在另一个“入口”文件中实例化它。输出文件使用 Webpack 捆绑，入口文件首先加载到输出文件中，在 View 代码之前。像这样:

index.js:

import $ from 'jquery';
import { Book } from './views/Book';

$(document).ready(function () {
  new Book();
});

Book.js

import Backbone from 'backbone';

const Book = Backbone.View.extend({
  tagName: 'li',

  template: _.template('<%= name %>'),

  render: function () {
    this.$el.html(this.template(this.model.toJSON()));
    return this;
  }
});

export default Book;

在运行项目时，我在控制台中收到此错误:

TypeError: __WEBPACK_IMPORTED_MODULE_1__views_Book__.Book is not a constructor
    at HTMLDocument.<anonymous> 
index.js:5 Uncaught TypeError: __WEBPACK_IMPORTED_MODULE_1__views_Book__.Book is not a constructor

运行 webpack 时，我收到此警告:

WARNING in ./js/index.js
5:6-10 "export 'Book' was not found in './views/Book'

我看到一些关于循环依赖的帖子，但不认为这是问题所在。有人可以帮忙吗？谢谢!

Answer 1

如果你使用

export default Book

那么你需要这样加载

import Book from './views/Book';

---

export Book

将与

一起工作

import { Book } from './views/Book';