2016-02-29 71 views
3

我正在開發的PHP(Phalcon),MySQL & JQuery的大型網站的第一個生產版本。這不是API的基礎,雖然有一些API可用於某些事情。這個稍微過時的堆棧是由於該項目多年前首次實現原型,並且出於我不願意承認的原因,因此需要數年時間才能進入生產開發階段。Aurelia多個應用程序在多個頁面

我意識到,硬頁面重新加載是去年,但他們也適用於這種規模的應用程序,當導航到不同的部分,服務於不同的目的。因爲它目前正在運行,所以一旦你進入了一個部分,它幾乎就像一個單獨的頁面應用程序,使用散列URL和ajax來改變一個或多個容器中的內容等,特別是在SEO不成問題的情況下。目前這一切都是用JQuery來完成的,而JQuery開始變得有點混亂和不可維護。還有一些功能,例如導航欄中的通知等,它們出現在站點的每個頁面上,並通過ajax進行更新和顯示。

我的專長是PHP。 Javascript也不能說是一樣的!但很顯然,單靠JQuery是不夠的。我需要一個JS框架來處理模板/綁定,本地路由到一個合理的深度和HTTP等MV ..?結構來更好地組織JS方面的事物並保持可維護性。我非常不喜歡Angular 1,並在我發現Angular 2即將迎來重大突破性改變時立即停止瞭解。我嘗試了Angular 2測試版,雖然更好,但它不會讓我的船漂浮。之前我曾經偶然發現過Aurelia alpha,儘管我沒有機會一起玩,看着vids並閱讀它,但它似乎是一個非常好的設備 - 很好的語法,專爲現在和未來設計,等等。現在在第1版測試版中,有更多的文檔和資源可供您學習,我感到相當舒適,可以儘早跳躍並將其用於此項目。

我非常知道什麼Aurelia路上可以做的,我有很多東西要學。然而,我目前面臨的絆腳石是如何構建它並將其納入到這個項目中。

集成

  1. 網站將需要不同的Aurelia路上的每個部分應用可能會每頁
  2. 一些Aurelia路上的應用程序將在所有頁面需要需要
  3. 多奧裏利亞應用

我發現了一個article by Patrick Walters,它似乎解釋瞭如何通過命名應用程序來完成這一操作。元素; <body aurelia-app="main" start="app">

然後設置一個共享的main.js;

aurelia.start().then(a => { 
    let start = a.host.attributes.start.value; 
    a.setRoot(start); 
}); 

這似乎是有道理的,所以我試了一下,但把呼叫放在一個div而不是身體。這不起作用,因爲host不能解決任何問題(我的IDE告訴我,甚至在我跑它之前)。這裏我們不需要主機名/端口信息,所以我認爲作者的意思是用元素替換host?但究竟如何?

像這種整合的任何進一步的建議,將不勝感激。

我已經看到了答案,在如此相似的問題,但他們似乎並不重用main.js但複製它,而不是它看起來不正確。

結構

我與SRC將文件移動到子目錄的事情分成一些明顯的結構發揮各地。我可以使它工作的唯一方法是爲每個配置中的每個添加一個命名路徑,例如"welcome*": "dist/welcome/welcome*",。這是最好的/唯一的方式嗎?

+0

嘿,我很好奇,如果你最終找到了一個令人滿意的解決方案,可以讓你「分組」常見的代碼塊。 – Zubzob

回答

4

我不認爲你的問題有一個正確的答案。只有你有能力決定哪種策略適合你的情況。據我所見,你可以通過Aurelia實現這一策略。但是,我不確定main.js的複用情況。

您可以加載奧裏利亞應用程序中使用的特定標籤內:

aurelia.start().then(() => aurelia.setRoot('my-root', document.getElementById('some-element')); 

如果你想在同一個頁面加載多個應用程序,你需要2個main.js文件。此線程Multiple Aurelia apps on one page在同一頁面中有兩個應用程序的非常有用的示例。

在我的理解中,共享同一頁面的應用程序應該有一個項目結構,這意味着只有一個config.js,src文件夾,dist文件夾等。不共享同一頁面的應用程序應該有不同的項目結構,使用不同的config.js,src文件夾,dist文件夾(如果需要,可以使用不同的Aurelia版本)。這保證了一個應用程序與另一個應用程序的獨立性,防止發生突變

當然,這只是我的意見。你可以等待奧裏利亞球員進一步的指示,他們總是在附近。

希望這有助於!