NETTE框架中如何以及在何處包含CSS和JS文件？

Question

當我使用傳統的添加外部文件的方法時，在Nette中遇到了將外部文件添加到模板的問題。 我將這些鏈接添加到了錯誤的文件中（模板不是應在其中添加的地方），或者使用的格式不正確。

我試圖在內部將CSS和js實現為效果很好的模板（latte）。 但是我需要在外部添加它們。

{block script}
  <link rel="stylesheet" type="text/css" href="..\sass\components\file.scss">
  <script src="..www\assets\js\file.js"></script>
{/block script}

Answer 1

您應該理解，服務器文件系統上的路徑與您將以模板發送給瀏覽器的URL無關，並且瀏覽器將使用這些URL進行進一步的HTTP請求。

例如，在使用Nette應用程序的常見情況下， /文件將在/path/to/your/project/directory/www ； 有些文件系統路徑（如www目錄之外的所有路徑）甚至都沒有相應的URL。

默認情況下，Latte不知道哪個文件與哪個URL匹配，因此它將src和href屬性保持與編寫時完全相同。 這意味着您需要確保自己使用正確的URL。

為方便起見，Nette自動在Latte模板中設置$basePath變量：

{block script}

  <link rel="stylesheet" type="text/x-scss" href="{$basePath}/sass/components/file.scss">

  <script src="{$basePath}/assets/js/file.js"></script>

{/block script}

該變量將指向您的應用程序的公共根目錄（ www/目錄），從而使URL的創建更加容易。

還要注意，您應該在URL中使用正斜杠，並且可能要鏈接到內置樣式表而不是SASS組件。