具有多個樣式表和js鏈接的Google Apps腳本

Question

我是Google Apps腳本的新手 ，正在嘗試在我的Google網站中實現一個太空畫廊 。

我已經在腳本編輯器中將css樣式表和.js文件分離為.html，並編寫了html頁面（minigallery.html），現在我試圖在Code.gs部分中將它們鏈接在一起。 到目前為止，這里是我在這里使用示例的內容： https : //developers.google.com/apps-script/guides/html/best-practices#separate_html_css_and_javascript

這是我目前在Code.gs中擁有的內容，但是當我運行發布的版本時，css和js文件似乎沒有鏈接（請允許我還沒有放入圖片）。 您可以在此處找到發布的鏈接：

//script.google.com/macros/s/AKfycbybCtW9y-iCT81WvBoCmfGnXWhSwQ5dpa7xyHU_H1ot/dev

`
 // Script-as-app template.
function doGet() {
  var app = UiApp.createApplication().setTitle('Business Card Mini Gallery | MAvC Graphics.').setHeight(50).setWidth(100)
  return HtmlService.createTemplateFromFile('minigallery')
      .evaluate();
}function include(customcss) {
  return HtmlService.createHtmlOutputFromFile('customcss')
      .getContent();
}function include(layoutcss) {
  return HtmlService.createHtmlOutputFromFile('layoutcss')
      .getContent();
}function include(minigallerycss) {
  return HtmlService.createHtmlOutputFromFile('minigallerycss')
      .getContent();
}function include(eyesjs) {
  return HtmlService.createHtmlOutputFromFile('eyejs')
      .getContent();
}function include(jqueryjs) {
  return HtmlService.createHtmlOutputFromFile('jqueryjs')
      .getContent();
}function include(layoutjs) {
  return HtmlService.createHtmlOutputFromFile('layoutjs')
      .getContent();
}function include(utilsjs) {
  return HtmlService.createHtmlOutputFromFile('utilsjs')
      .getContent();
}function include(minigalleryjs) {
  return HtmlService.createHtmlOutputFromFile('minigalleryjs')
      .getContent();
}

`這是我寫得不好的minigallery.html代碼，用於鏈接css和js（第一行和最后一行是最重要的）：

    <?!= include('customcss'), ('layoutcss'), ('minigallerycss'); ?>

...//lengthy inner page code

<?!= include('eyejs'), ('jqueryjs'), ('layoutjs'), ('minigalleryjs'), ('utilsjs'); ?>

為了使事情復雜化，我將整個事情從spacegallery重命名為minigallery，但是我已經適當地更改了所有文件。

Answer 1

您只需要一個名為include函數。 現在，您有許多名為“ Include”的功能。

要查找的文件名傳遞給include函數：

<?!= include('Stylesheet'); ?>

在上面的行中， Stylesheet是從中獲取內容的文件的名稱。 除了具有多個功能之外，您還需要多個腳本集。

minigallery.html

<?!= include('customcss'); ?>
<?!= include('layoutcss'); ?>
<?!= include('minigallerycss'); ?>
<?!= include('eyesjs'); ?>
<?!= include('jqueryjs'); ?>
etc.

在您的.gs文件中，只有一個include語句：

Code.gs

function doGet() {

  return HtmlService.createTemplateFromFile('minigallery')
   .evaluate() // evaluate MUST come before setting the NATIVE mode
   .setTitle('Business Card Mini Gallery | MAvC Graphics.')
   .setSandboxMode(HtmlService.SandboxMode.NATIVE);
}

function include(filename) {
  return HtmlService.createHtmlOutputFromFile(filename)
      .getContent();
}

該代碼直接來自文檔。 filename是一個變量，它可以采用傳遞給它的任何值。

您可以將HTML與UI服務一起使用。 見下面的鏈接：

Google文檔-通過UI服務使用HTML

但是，我認為您不能同時使用HTML和UI服務。 我找不到任何能說明這一點的信息，但是我知道我曾經嘗試過。 因此，我很確定您需要決定一個或另一個。 但是，如果有人知道一種方法，我肯定會知道如何做。