2016-03-15 2 views
1

Я работаю над переключением своего приложения Marionette из requirejs в Webpack, и после много проблем, я почти там, но есть одна вещь, которую я просто не могу понять: как загрузить мое приложение.Как загружать приложение с помощью Webpack

С requirejs Я только что заново открыл глобальную переменную var app;, в которой я храню свой основной объект Marionette.Application, чтобы получить доступ к нему из других файлов.

Однако Webpack изменяет this от window до текущего модуля, поэтому мой var app; suddendly не является глобальным.

Я попытался присвоить их всем window: window.app;, но я до сих пор не могу получить к ним доступ из других модулей.

Моя последняя попытка была использована ProvidePlugin, но я получаю пустой объект во всех файлах, кроме первого, поэтому я удалил его.

Мой текущий код:

bootstrap.js (главная точка входа в webpack.config.js): импорт App из "приложений/главный";

// Start history when our window.app.ication is ready 
app.listenTo(app, 'start', function() { 
    var that = this; 
    $.when(
     this.auth.checkAuth() 
    ).always(function(){ 
     that.router.start(); 
    }); 
}); 

app.start(); 

приложений/main.js:

import Router from "routers/mainRouter"; 

module.exports = new Marionette.Application({ 
    initialize: function(){ 
     this.router = new Router(); 
    } 
}); 

маршрутизатор/mainRouter.js:

import App from "apps/main"; 

module.exports = Marionette.AppRouter.extend({ 
    start: function(){  
     App.something(); 
    }, 
}); 

в mainRouter я: не могу сделать что-то() на неопределенное.

Любые идеи?

ответ

1

У вас есть круглые зависимости - apps/main.js импорт router/mainRouter.js, но router/mainRouter.js также импортирует apps/main.js. Webpack должен сделать выбор, который нужно разрешить первым, поэтому приложение не определено, пока выполняется ваш код маршрутизатора.

Вам необходимо будет перестроить свой код, чтобы циклическая зависимость больше не присутствовала. Простейшим решением было бы переместить ваш код маршрутизатора в apps/main.js. Тем не менее, я не работаю с Marionette лично, поэтому могут быть более элегантные способы исправить это, о чем я не знаю.

+0

Я думал, что весь смысл Webpack заключается в том, что, поскольку он компилирует код, он может быть умным с круговыми зависимостями. Если это не удаляет большую часть его полезности. Во всяком случае, поэтому я спросил о глобальных переменных, если я могу сделать свой объект «app» глобальным, тогда мне не нужно импортировать его в маршрутизаторе, так как я уже могу получить к нему доступ. Но похоже, что нет возможности имитировать простую глобальную переменную. – Growiel

0

Посмотрите, можете ли вы временно изолировать свои импортные товары, а затем пройти через сборку файлов в Интернете. Вы должны это сделать. Одна вещь, на которую я не уверен на 100% смотреть на этот код. Вы используете импорт ES6 и экспорт модулей commonjs. Я думаю, вы хотите export default new Marionette.Application({ ... });

Смежные вопросы