如何將Django模板變量傳遞給WebPack模塊

我剛剛瞭解WebPack模塊，並且正在考慮將我的Django應用程序的整個JS基礎結構移動到模塊中。看起來，這樣做的直接方法是爲每個Django模板（或視圖）創建一個webpack模塊，並在每個頁面上都有一個<script>標籤。如何將Django模板變量傳遞給WebPack模塊

但是，我試圖找到一種方法將Django模板變量的內容傳遞給這些webpack模塊。以前我本來這些變量內聯：

<script> 
//Sample code.. 
var arr = []; 
{% for s in vars %} 
arr.push(s); 
{% endfor %} 
</script>

現在，我只有：

<script src="temp.js"></script>

我發現了一個潛在的解決方案是定義的WebPack模塊是出口單根函數庫瀏覽器中的全局名稱空間。然後使用嵌入式script標記將Django變量放入JS變量中，並將其作爲參數傳遞給導出的函數。

這不知何故感覺像一個笨拙的做事方式。關於如何更好地處理這個問題的任何想法？

謝謝！

來源

2015-05-28 user1496984

我有完全相同的問題。我正在爲使用React的其他系統編寫一個插件（我真的很喜歡這樣做比較簡單，相比之下Ember喜歡控制整個演出），它使用django模板。插件擴展點依賴於幾個模板值。我將我的webpack包構建爲一個庫，並導出一個函數作爲參數，缺少模板值。我完全同意它感覺非常笨拙，但我認爲我們正在合併兩種根本不同的方法，所以它有點被期待！ – dpwrussell

下面是我已經做到了，基於問題的意見dpwrussel的提示和this question：

在我的模塊，我進口，我這樣做：

var React = require('react') 
var ReactDOM = require('react-dom') 

window.render_my_thing = function(properties) { 
    ReactDOM.render(...) 
}

然後在我的Django模板，我添加以下內容：

<script>                   
    render_my_thing({ 
     property1: "{{ property1 }}", 
     property2: "{{ property2 }}", 
    })                 
</script>

來源

2016-07-06 20:16:01 rrauenza

如何將Django模板變量傳遞給WebPack模塊

回答

相關問題