Javascript 如何使用；进口；在高分子元素中

我正在尝试以下方法：

<dom-module id="my-app">
    <template> <div>{{data.name}}</div> </template>

    <script>
        import data from 'data';

        class MyApp {
            constructor() { ... }
            beforeRegister() {
                this.is = 'my-app';
                this.properties = {
                    data: {
                        type: Object,
                        value: function () {
                            return data;
                        },
                    }
                };
            }

            ready() {}
            ...
        }  
    </script>
</dom-module>

只要我没有从“数据”导入数据的

行

，这就行了。现在，我在浏览器中遇到以下错误：

require is not defined

因此，我决定将

browserify

添加到

babel

 .pipe($.if('*.js', $.browserify({ debug: true, extensions: ['.js', '.html'] })))

现在我得到一个传输文件错误

ParseError: 'import' and 'export' may appear only with 'sourceType: module'

我想我很接近了，但不幸的是我现在被困在这里了。为了重现这一点，我创建了一个github repo

您可以查看并执行以下操作：

$> cd polymer-es6
$> npm install
$> bower install
$> gulp js

---

一个额外的问题：为什么不调用

构造函数

？似乎调用了

ready

。

第一个文件的文件名是什么？我认为，除非将JSX transformer（

react

）列入黑名单，否则在编译类似于Babel的标记和JS混合文件时会遇到问题。如果你打算使用browserify，你可能应该使用

babelify

转换，而不是一个吞咽式插件。谢谢你的建议。我要试试看！在当前使用crisper的情况下，有什么建议吗？请查看IMD（导入模块加载器）。那可能会有帮助。我没有特别提到导入，因为需要做更多的实验。非常感谢你指出这一点。我想现在我要把我的输入改写成另一个聚合物元素。现在我还有一个聚合物主题要探讨：）

$> cd polymer-es6
$> npm install
$> bower install
$> gulp js