web-dev-qa-db-ja.com

Object.assignは関数ではありません

私はgbelでbabelを使用して、ES6で単純なDOMライブラリーを作成しています。しかし、実行後、それを使用するときに、chromeコンソールに_Object.assign is not a function_が表示されます。

これは一口コードです

_gulp.task('scripts', function() {
    return gulp.src(src + 'js/*.js')
      .pipe(babel())
      .pipe(concat('main.js'))
      .pipe(gulp.dest(dest + 'js'));
});
_

これはクラスファイルです

_class DOM {
    constructor( selector ) {
        var elements = document.querySelectorAll(selector);

        this.length = elements.length;

        Object.assign(this, elements);
    }

    ...

}

const dom = selector => new DOM(selector);
_

dom('#elId');のようにクライアント側で使用しています

javascriptgulpecmascript-6babeljs
14
TIJ

既にご存知のように、Google Chromeは V8 を使用し、ECMAScript 5th Editionをサポートしています。 Object.assign はECMAScriptで導入されています第6版。

これらの追加を使用するには、 ES6ポリフィルを含める Babelによって提供される必要があります。

これにより、完全なES6環境がエミュレートされます。 [...]

browser-polyfill.js npmリリース内のbabel-coreファイルから入手できます。これは、コンパイルされたすべてのBabelコードの前に含める必要があります。コンパイルしたコードの前に追加するか、またはその前の<script>に含めることができます。

27
Jacob Budin
  1. インストールbabel-core：

$ npm install babel-core --save-dev

  1. polyfillモジュールをjsにインポートします。

import 'babel-core/polyfill';

  1. Babelを使用してコードをコンパイルしてください！
12
Amo Wu