讓HTML根據環境從不同的地方加載JS文件

如何根據我的環境從不同的地方加載我的index.html JS文件？讓HTML根據環境從不同的地方加載JS文件

在發展中，我想我的文件src是一個絕對路徑：/dist/bundle.js

在生產中，我想我的文件src是一個相對路徑：dist/bundle.js

下面是HTML哪裏該文件已加載：

<!doctype html> 
<html> 
    <head> 
    <title>Sample App</title> 
    </head> 
    <body> 
    <div id='root'> 
    </div> 
    <script src="/dist/bundle.js"></script> 
    </body> 
</html>

如果有幫助，我正在使用Webpack。

來源

2016-08-28 Don P

一般來說，最好的解決方案是改變你的開發環境以適應你的生產環境（反之亦然）。兩者之間的不同之處在於將代碼從開發轉移到生產時可能會出錯的一件事。我知道這不是你在這裏尋找的解決方案。但是，應該提到。 – Makyen

你已經提到webpack正在被使用，我假設一個不同的配置被用於開發和生產。

您可以嘗試html-webpack-plugin並將其設置爲在您的index.html文件中注入腳本。這樣腳本就會根據webpack輸出設置注入到HTML中。您可能需要相應地調整您的配置。如果這不起作用，webpack-path-rewriter似乎也是一個選項，但我還沒有嘗試過。

或者您可以編寫一個小腳本，根據document.location.hostname確定環境，然後包含帶有正確src路徑的<script>。但是這種方法看起來並不正確，而且很容易改變域名。

但我會同意@Makyen，使環境相同。我認爲製作人會更難以改變，所以請儘量將其與您在開發中所做的任何一件事相匹配。

來源

2016-08-28 22:43:12

讓HTML根據環境從不同的地方加載JS文件

回答

相關問題