2016-03-03 17 views
6

Próbuję obecnie dziedziczyć wiele plików w ES6, z node.JS i Babel (używam Babel do konwersji kodu z ES6 do ES5, ponieważ węzeł nie implementuje teraz ES6). Używam importu/eksportu do "łączenia" plików differents.TypeError: Super wyrażenie musi mieć wartość null lub funkcję, nie jest niezdefiniowane z Babeljs

Właściwie mam: Parent Class (plik 1)

export class Point 
{ 
    constructor(x, y) 
    { 
     this.x = x; 
     this.y = y; 
    } 

    toString() { 
     return '(' + this.x + ', ' + this.y + ')'; 
    } 
} 

I: klasa Child (Plik 2)

import Point from './pointES5' 

export class ColorPoint extends Point 
{ 
    constructor(x, y, color) 
    { 
     super(x, y); 
     this.color = color; 
    } 

    toString() { 
     return super.toString() + ' in ' + this.color; 
    } 
} 

A głównym Main (File 3)

import Point from './pointES5' 
import ColorPoint from './colorpointES5' 

var m_point = new Point(); 
var m_colorpoint = new ColorPoint(); 

console.log(m_point.toString()); 
console.log(m_colorpoint.toString()); 

Robię to, aby przetestować wywołania metody toString() od nadrzędnego i od podrzędnego.
Więc używam Babel do konwersji kodu z ES6 na ES5 i uruchamiam każdą część osobno, aby sprawdzić, czy jest w porządku, czy nie.
- Punkt (jednostka nadrzędna) jest dobry i wykonuje się bez błędu.
- Colorpoint (dziecko) nie całkowicie biegać i rzucać:

TypeError: Super expression must either be null or a function, not undefined

Pierwsza linia StackTrace jest:

function _inherits(subClass, superClass) { if (typeof superClass !== 'function' && superClass !== null) { throw new TypeError('Super expression must either be null or a function, not ' + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.proto = superClass; } (It comes from the ES5 converted code (Babelified), and I can post it entirely if it's needed).

To frustrujące przyczyną tego kodu jest bardzo proste ... Ale nie widzę powodu, dla którego wystąpił błąd.

staram differents wersje Babel (5, 5.8, 6), ale nie ma żadnych różnic ...

Co zrobiłem źle?

PS: Zapomniałem powiedzieć: DZIAŁA PERFEKCYJNIE, gdy robię to w jednym pliku. Ale to dla mnie bardzo ważne, aby mieć tylko jedną klasę plik ...

Odpowiedz

24

Twój eksport nie pasuje do importowania:

export class Point 
// and 
import Point from './pointES5' 

Ty eksportowania o nazwie symbol ale importowania domyślnego, więc w drugim pliku otrzymam niewłaściwy obiekt jako Point.

Można zastosowanie:

export default class Point 

w pierwszym pliku klasy lub

import {Point} from './pointES5'; 

w drugim pliku do pobrania odpowiedniego odniesienia. Jeśli wybierasz układ jednej klasy na plik, proponuję ten pierwszy. Zazwyczaj wyeksportowana jest tylko jedna klasa, więc warto mieć ją jako domyślną.

Co masz teraz jest odpowiednikiem:

// in Point 
module.exports = { 
    Point: Point 
}; 

// in ColorPoint 
var Point = require('./pointES5'); // will point to *the whole object* 

class SubPoint extends Point 
+0

Wow cholera!Rozumiem nieco więcej, czym jest "domyślne" słowo kluczowe i do czego jest ono teraz używane! Dziękuję bardzo za Twoją pomoc ! Działa doskonale! : D – Aethyn

+0

W przypadku korzystania z pakietu internetowego do pakowania w pakiety, polecam użycie drugiego podejścia sugerowanego przez @ssube, które wykorzystałoby drżenie drzewa w pakiecie Webpack 2.0 w celach wydajnościowych: http://2ality.com/2015/12/webpack -tree-shaking.html –