HtmlWebPackPlugin注入位置

開發服務器，我的webpack將構建我的捆綁包，其中包括jQuery。HtmlWebPackPlugin注入位置

我使用html-webpack-plugin，下面的代碼行會在構建prod時將我的包注入到body中。

new HtmlWebPackPlugin({ 
      template: './src/index.html' 
     }),

我的問題是，在我的index.html，我語義ui.js，它依賴於jQuery的，

<body> 
     <my-app>loading...thaison</my-app> 

     <script src="./asset/semantic-ui/dist/semantic.min.js"></script>  
    </body>

所以，當我火我的開發環境或督促建設，出現包語義之後，因此我有一個錯誤。我如何製作以便在我的手動腳本源之前進行開發注入？

開發服務器服務：

webpack-dev-server --inline --progress --port 4000 --content-base src

來源

2016-09-29 chungtinhlakho

這是因爲你使用的標記之前的JS默認注射位置。我解決這個問題的一種方法是：

在HtmlWebPackPlugin config中將注入設置爲false。
添加一個注射點的指數（EJS）模板：下面

代碼：

<% for(var i=0; i < htmlWebpackPlugin.files.js.length; i++) {%> 
<script type="text/javascript" src="<%= htmlWebpackPlugin.files.js[i] %>"></script> 
<% } %>

您可以添加你喜歡的指數模板這在任何地方，從而避免它在被注入結束。

您可以在「Writing your own templates」部分閱讀有關模板中可用選項的更多信息。例如，您可能想要訪問文件塊，而不是原始文件列表。

來源

2017-08-08 14:40:13

HtmlWebPackPlugin注入位置

回答

相關問題