从静态html访问Polymer3.0自定义元素

Question

我创建了一个自定义的Polymer3.0元素。当我做ploymer serve时，它工作得很好。

我们有一个内部的企业NPM注册中心，我在其中发布了我的元素。

现在我想在一个完全不同的项目中使用这个元素(它只有静态HTML/JS(，并由NGNIX服务器提供服务。

• 这可能吗？如果是，如何处理
• 我是否需要通过node或http-server为我的自定义元素提供服务器，以便在完全不同的项目中的静态html中使用
• 我们可以为像CDN这样的polymer3.0元素提供服务器吗？我看到了一些带有unpkg的帖子，但为此我需要发布到全局NPM。还有其他选择吗

Answer 1

我能够解决这个问题(事实上是我没有查看polymer.json中的所有选项(。

如果有人感兴趣，下面就是我所做的。。

• 在我的ploymer.json中，我添加了以下内容json的shell属性指向我的自定义元素js文件
• 我还添加了js属性"compile":true

以下是我的polymer.json看起来像

...
"shell": "xxxxx.js",
"builds":[
{
"name": "prod",
"preset": "es6-bundled",
"bundle":true,
"moduleResolution": "node",
"addServiceWorker": true,         
"inlineCss": true,          
"inlineScripts": true,      
"rewriteUrlsInTemplates": true, 
"sourcemaps": true,     
"stripComments": true,     
"js": {"minify":true, "compile":true},
"css": {"minify":true},
"html":{"minify":true}
},
...

我将build/文件夹中的文件复制到nginx服务器，并将其作为常规文件夹托管。当然，我将add_header Access-Control-Allow-Origin *;添加到我的conf文件中

在我的静态HTML中导入我的组件，我所要做的就是

<script src="https://unpkg.com/@webcomponents/webcomponentsjs@2.4.3/webcomponents-loader.js"></script>
<script type="module" src="http://XXX_MY_NGINX_VIRTUAL_HOST_XXXX/my-custom-element.js"></script>