Backbone View由於導入順序而不是Webpack中的構造函數錯誤

我在1個文件中有一個骨幹視圖，我試圖在另一個'entry'文件中實例化。使用Webpack將輸出文件捆綁在一起，並在輸出文件中首先將條目文件加載到視圖代碼之前。事情是這樣的：Backbone View由於導入順序而不是Webpack中的構造函數錯誤

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'

我看到一些關於循環依賴的帖子，但不認爲這是這裏的問題。有人可以幫忙嗎？謝謝！

來源

2017-08-26 user3033194

如果使用

export default Book

，那麼你需要這樣

import Book from './views/Book';

export Book

加載，它將與工作

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

來源

2017-08-27 10:50:35

是的，前段時間我解決了這個問題，但'視圖不是構造函數'錯誤仍然存在。我認爲他們可能有關係，但他們顯然不是。謝謝！ – user3033194

也許我需要配置Webpack，以便在運行index.js（當前設置爲入口點）之前加載依賴關係。 – user3033194

好的，修復程序正在改變我的webpack配置文件中的入口點。我從變化的切入點：

entry: '/index.js'

到

entry: [SRC_DIR + '/views/main.js', SRC_DIR + '/index.js']

這保證了依賴（在main.js）首次加載，其次是index.js文件。因此，在捆綁的輸出文件中，依賴項（在本例中爲Book視圖）在初始化它們之前已經實現。因此問題不在於我發佈的代碼中，而是在Webpack的配置文件中。

來源

2017-08-27 11:40:04 user3033194

Backbone View由於導入順序而不是Webpack中的構造函數錯誤

回答

相關問題