Question

我为电子表格创建了一个带有自定义功能的侧边栏。它曾经按预期工作，但是当我最近打开文件时，它无法正确加载。

我有一个名为Page的html文件，其中包含html代码。我有另一个文件Stylesheet来存储css并将其添加到Page，如下所示：

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <link rel="stylesheet" href="https://ssl.gstatic.com/docs/script/css/add-ons1.css">
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
    <?!= include('Stylesheet'); ?>
  </head>
  <body>
    My Content
  </body>
</html>

这用于在我打开文件时正确加载样式表。但是，现在我看到了这一点：

据我所知，我从这里遵循正确的方法和流程： https://developers.google.com/apps-script/guides/html/best-practices

我担心我会遗漏一些显而易见的东西，但我很感激您可以提供任何帮助以使其发挥作用。

更新

这是我的Stylesheet代码：

<style>
    .width-100 {
      width: 98%;
      height: 100%
    }
    .red{ color:red; }
    i.material-icons,input[type='Submit']{
      cursor:pointer;
    }
    i.material-icons.active{
      border-bottom: 2px solid red;
      padding-bottom: 3px;
    }
    .sidebar.branding-below {
      top: 0;
    }
    .sidebar.bottom {
      border-top: 1px solid #ddd;
    }
    img.logo{
      position: relative;
      vertical-align: middle;
    }
    #topBar {
      border-bottom: 1px solid #bbb;
      margin-bottom: 10px;
      padding-bottom: 5px;
    }
    #settingForm {
      position: absolute;
      background: white;
      margin: 10px;
      width: 260px;
      top: 36px;
      box-shadow: 2px 2px 1px #bbb;
      border: 1px solid grey;
      padding: 10px;
      position: relative;
    }
    #settingForm hr {
      margin-top: 0;
    }
    #proserWorkSecurity{
    }
    #proserWorkSettings h3 {
      margin: 0 0 10px 0;
      line-height: 20px;
    }
    i#settingsClose {
      position: absolute;
      top: 10px;
      right: 10px;
      font-size: 20px;
    }
    #processingWindow {
      position: absolute;
      padding: 200px 30px 30px 30px;
      width: 78%;
      height: 69%;
      background-color: rgba(256,256,256,0.9);
    }
    .formButton{
      cursor: pointer !important;
    }
    .formButton:hover{
      background: -webkit-linear-gradient(top, #4d90fe, #4787ed) !important;
      color: white !important;
      border: 1px transparent !important;
    }
    .Loader {
      text-align: center;
      padding: 80px 0;
    }
    .Loader_label {
      color: #363636;
      font-size: 13px;
      font-weight: 700;
      margin: 15px 0;
    }
    .CircleSpinner {
      -webkit-animation: spin 0.6s infinite linear;
      animation: spin 0.6s infinite linear;
      fill: #2196f3;
      height: 30px;
      width: 30px;
    }
    svg {
      overflow: hidden;
    }
  </style>

这是我的include：

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

更新2

我创建了一个测试实例，以便更容易看到发生了什么。我添加了一个自定义菜单Campaign Manager，其中包含一个菜单项以打开侧边栏。

https://docs.google.com/spreadsheets/d/10gsWSkaSvf7oi45SBluJm3Y-GsIteMrOP7uzP-26ewU/edit?usp=sharing

Answer 1

使用新的项目版本重新部署它。

Google Apps脚本无法加载Tempate html文件

1 个答案: