user2217288
user2217288

Reputation: 547

Create basic example polymer 3 that works ie11

Hello i start create basic project polymer init. Only think i change is add to polymer.json

  "builds": [
    {
      "js": {
        "compile": "es5"
      }
    }
  ]

In polymer serve it works. Still i want to build my component to run. I use polymer build.

Build process only return polymer.json

{
  "entrypoint": "index.html",
  "fragments": [],
  "sources": [
    "src/**/*",
    "index.html"
  ],
  "extraDependencies": [
    "bower_components/webcomponentsjs/*.js"
  ],
  "builds": [
    {
      "js": {
        "compile": true
      }
    }
  ],
  "lint": {
    "rules": [
      "polymer-3"
    ]
  },
  "npm": true,
  "componentDir": "node_modules/",
  "moduleResolution": "node"
}

When i create sample server that code runs in Opera

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1, user-scalable=yes">

    <title>aaaaaa</title>
    <script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-bundle.js"></script>
    <script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-loader.js"></script>
    <script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
    <script defer type="module" src="/test1-element.js"></script>
</head>
<body>
<h1>aaaa</h1>
<test1-element prop1="test1text"></test1-element>
</body>
</html>

What should i do to run very basic example in IE 11.

Upvotes: 0

Views: 536

Answers (1)

Maarten Albers
Maarten Albers

Reputation: 33

I think your script tags are in the wrong order: (I haven't tried it myself, yet, I'm just researching, at the moment): https://polymer-library.polymer-project.org/3.0/docs/polyfills

custom-elements-es5-adapter.js. This small polyfill allows you to run compiled, ES5 elements on browsers that support native custom elements. This is useful in static serving environments where you need to serve a single app version to all browsers. The adapter is discussed in more detail in ES6 and in Build for production. Important note: the es5 adapter must come before the webcomponents polyfills, if any.

Upvotes: 1

Related Questions