最小工作聚合物示例

2024-05-27

我一直在尝试使用 Polymer 获得一个极其简单的网页,以便在浏览器中简单地呈现 - 我在服务器端使用 Node/ExpressJS/Jade 设置。我的代码与 Polymer 文档附带的示例非常接近,我认为我缺少一些非常简单的东西。我正在使用 Chrome M35。

在服务器上,我已经使用 Bower 安装了所有聚合物材料(平台、核心和纸张),并且已经映射bower_components静态提供服务/static

app.use('/static', express.static(path.join(process.cwd(), 'bower_components')))

我已经验证我的服务器可以正确提供资源,例如http://localhost:3000/static/paper-button/paper-button.html– 这将返回所需文件的内容。

该页面提供的 HTML 如下:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <script src="/static/platform/platform.js"></script>
    <title>Authenticate</title>
    <link rel="import" src="/static/paper-button/paper-button.html">
    <style>
      body {
        font-family: 'Helvetica Neue';
        margin: 0;
        padding: 24px;
        user-select: none;
        transform: translateZ(0);
      }

      paper-button {
        margin: 1em;
        width: 10em;
      }

      paper-button.colored {
        color: #4285f4;
        fill: #4285f4;
      }

    </style>
  </head>
  <body>
    <paper-button label="Authenticate" class="colored"></paper-button>
  </body>
</html>

这与文档中记录的相同小部件的示例非常接近高分子网站 http://www.polymer-project.org/components/paper-button/demo.html。就我而言,没有任何渲染。真正奇怪的是检查器的“网络”选项卡中显示的内容:

有一个Loader.js脚本,我相信它是通过安装的platform.js,它发送根页面本身的 XHR(第 3 行)。在我看到的每个其他示例中,加载脚本都会开始加载导入的 Web 组件。我只是不明白为什么在我的例子中会这样做。另一个奇怪的事情是来自Parser.js– 请求的数据 URL 为data:text/javascript;base64,Ci8vIyBzb3VyY2VVUkw9bnVsbC9bMTQ1M10uanMK,翻译为://# sourceURL=null/[1453].js- 再说一遍,这不是一个好兆头。

我尝试过使用相对srcs 在我的链接中 - 无济于事。我基本上陷入了非常早期的阶段,非常感谢能指出正确的方向。


这个不对:

<link rel="import" src="/static/paper-button/paper-button.html"> 

它应该是:

<link rel="import" href="/static/paper-button/paper-button.html">

旁注:您可能还想使用 favicon Express 中间件来防止“可疑”http 请求。 (如果您的公共根目录中没有图标,您将看到一个额外的 http 请求由 Express 处理,如果您的公共根目录中没有图标,中间件将为 Express 图标提供服务。)

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

最小工作聚合物示例 的相关文章

随机推荐

  • jest快照测试:如何忽略jest测试结果中的部分快照文件

    问题 忽略 snap 文件测试结果的某些部分 这里的问题是 我的测试中有一些组件具有随机值 我并不真正关心测试它们 有什么办法可以忽略我的 X snap 文件的一部分吗 因此 当我将来运行测试时 它不会给我测试失败的结果 现在您还可以使用属
  • 如何使用 Newtonsoft Json.NET 处理 JSON 文档中的对象引用?

    我有一个 json 数据集 带有标准数据字段和参考字段 它看起来像这样 id 1 name Book description Something you can read id 2 name newspaper description re
  • Android Json结果处理

    我有这样的 Json 结果 array getJSONObject j 执行代码 WAT2 FreeIssuePrefix DisPaySchedulePrefix NextFreeIssueNo 1 NextReturnNo 20 Upl
  • Spring boot 404错误自定义错误响应ReST

    我正在使用 Spring boot 来托管 REST API 即使浏览器正在访问 URL 以及自定义数据结构 我也希望始终发送 JSON 响应 而不是使用标准错误响应 我可以使用 ControllerAdvice 和 ExceptionHa
  • 将异步函数包装在结构中时的生命周期

    我正在尝试将异步函数包装在结构中 例如 use std future Future struct X struct Y async fn f x X gt Y Y struct MyStruct
  • Java:BufferedInputStream 的 available() 方法存在问题

    我正在处理以下代码 用于将大文件拆分为一组较小的文件 FileInputStream input new FileInputStream this fileToSplit BufferedInputStream iBuff new Buff
  • 谁知道 Picasa 是用什么编程的?

    我正在寻找有关如何构建 Picasa 的信息 因为我想为我的应用程序创建一个类似的界面 信息可以包括编程语言 UI设计等 我找到了这个美丽的 Picasa UI 由动态 PSD 文件组成 http web archive org web 2
  • 完整的 C++ i18n gettext()“hello world”示例

    我正在寻找完整的 i18ngettext 你好世界的例子 我已经开始了一个基于的脚本使用 GNU gettext 的本机语言支持教程 https web archive org web 20130330233819 http oriya s
  • 如何删除带有操作栏、视图页面和多个片段的选项卡?

    我正在使用我找到的代码here https stackoverflow com questions 10082163 actionbarsherlock tabs multi fragments public class ActionBar
  • craigslist 混搭如何获取数据? [关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • 将额外的参数传递给多态函数?

    我有一个多态函数 可以将列表转换为集合 import shapeless PolyDefns gt import shapeless val lists List 1 2 List A B List 1 1 2 2 HNil object
  • Java - 了解 PrintWriter 和刷新的需要

    好吧 首先我对所有代码表示歉意 但我觉得代码太多总比代码不够好 我正在制作一个简单的聊天客户端和印刷机 尤其是我正在努力解决的问题 使用现在的代码 它将与服务器类交互 并且完美地打印我想要打印的内容 但是 当我删除 writer flush
  • Python子进程:cmd退出时的回调

    我目前正在使用启动一个程序subprocess Popen cmd shell TRUE 我对 Python 相当陌生 但 感觉 应该有一些 api 可以让我做类似的事情 subprocess Popen cmd shell TRUE po
  • 如何使用 eval dataframe 方法在自定义函数中返回 numpy 数组或列表?

    我正在使用 python 3 X 我正在尝试使用eval https pandas pydata org pandas docs stable generated pandas eval html pandas eval数据框方法 包括这样
  • 选择 Enum 类型的默认值而无需更改值

    在 C 中 是否可以用属性修饰 Enum 类型或执行其他操作来指定默认值 而不更改值 无论出于何种原因 所需的数字可能是一成不变的 并且仍然可以控制默认值会很方便 enum Orientation None 1 North 0 East 1
  • Android Studio“等待调试器”

    我创建了简单的 你好 世界 使用 android studio 的项目 当我在设备或模拟器上运行它时 一切都很好 然后我尝试在调试模式下运行它 几分钟后屏幕上的 等待调试器 对话框失败并且 Error running test test U
  • 为什么我们要关闭 Mysqli 中的结果

    为什么我们要关闭 result mysqli new mysqli localhost root root test if mysqli gt connect errno echo Failed to connect to MySQL my
  • Freebase RDF 转储的 C# 解析仅产生 1150 万个 N-三元组,而不是 19 亿个

    我正在构建一个 C 程序来读取 RDF 数据Google Freebase 数据转储 https developers google com freebase data 首先 我编写了一个简单的循环来简单地读取文件并获取三元组的计数 然而
  • 控制 HTML 中的图像加载顺序

    有没有办法控制网页上图像的加载顺序 我正在考虑尝试通过首先加载轻量级 加载 图形来模拟预加载器 有任何想法吗 Thanks 使用 Javascript 并填充图像src属性稍后 这 告诉浏览器链接到页面上的 URL 因此不会向服务器发送请求
  • 最小工作聚合物示例

    我一直在尝试使用 Polymer 获得一个极其简单的网页 以便在浏览器中简单地呈现 我在服务器端使用 Node ExpressJS Jade 设置 我的代码与 Polymer 文档附带的示例非常接近 我认为我缺少一些非常简单的东西 我正在使