Polymer 在 WAMP 中或使用 Python 呈现空白页面

Question

我是 Polymer 的新手，我正在使用 WAMP 在我的本地主机上托管我的 Polymer 1.0 项目。我在本主题中看到了其他问题，但 none 的答案对我有帮助，因为我在 Chrome 浏览器中仍然得到没有错误（或警告）的空白页面。我唯一得到的是页面顶部看起来像灰色条的东西。

我正在关注 this tutorial in Youtube。

我实际上已经尝试过在 localhost:8000 上使用 Python 并且我得到了同样的结果，所以我怀疑我的代码有问题。

注意 1： 如果我只有一个 <paper-input> 元素及其声明，它工作正常。

注意 2： 代码实际上在开始时有效，但当我开始做一些实验时 (!!!) 然后页面开始呈现空白且没有错误！奇怪！

这是我的代码：

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>

    <script src="/bower_components/webcomponentsjs/webcomponents.js"></script>
    <link rel="import" href="/bower_components/polymer/polymer.html">
    <link rel="import" href="/bower_components/paper-header-panel/paper-header-panel.html">
    <link rel="import" href="/bower_components/paper-material/paper-material.html">
    <link rel="import" href="/bower_components/paper-toolbar/paper-toolbar.html">
</head>

<body class="vertical layout" style="background-color: #dddddd;">
    <paper-header-panel>
        <paper-material style="background-color: #ffffff;">
            <paper-toolbar>
                <div>Example My Polymer</div>
            </paper-toolbar>

            <h3>This is my content 1</h3>

            <p>Hello</p>
        </paper-material>
    </paper-header-panel>
</body>
</html>

Answer 1

这是使用 paper-header-panel

时的常见问题

Important: The paper-header-panel will not display if its parent does not have a height.

让你的body（paper-head-panel的parent）占据整页高度：

<body class="fullbleed">

Polymer 在 WAMP 中或使用 Python 呈现空白页面

Polymer renders a blank page in WAMP or using Python

python

wamp

wampserver

web-component

polymer-1.0