Object.assign不是函數

Question

我在gulp中使用babel，並在ES6中創建了一個簡單的DOM庫。 但是在運行之后，當我要使用它時，我得到了Object.assign is not a function chrome控制台中Object.assign is not a function 。

這是gulp代碼

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');

Answer 1

我懷疑您已經知道，Google Chrome使用V8 ，它支持ECMAScript 5th版本。 在ECMAScript第6版中引入了Object.assign 。

為了使用這些添加，您需要包括 Babel提供的ES6 polyfill ：

這將模擬完整的ES6環境。 [...]

可從babel-core npm版本中的browser-polyfill.js文件中獲得。 必須在所有已編譯的Babel代碼之前將其包括在內。 您可以將其添加到已編譯的代碼之前，也可以將其包含在<script> 。

Answer 2

1. 安裝babel-core ：

$ npm install babel-core --save-dev

2. 將polyfill模塊導入您的js：

import 'babel-core/polyfill';

3. 使用babel編譯您的代碼！