1

Использую связку pixi.js + машинопись + es6 + system.js

import Test from './test';

export class Main {
    constructor() {
        console.log('typescript main ');
        new Test();
    }
}

import PIXI from 'pixi.js';

export default class Test extends PIXI.Sprite{
    constructor(){
        super();
    }
}

typescript main test.js:4 Uncaught (in promise) TypeError: Cannot read property 'prototype' of undefined at new __extends ( http://localhost:8080/javascripts/test.js:4:21 ) at new Main ( http: //localhost:8080/javascripts/main.js:13:21 ) 在http://localhost:8080/javascripts/systemfile.js:18:16

我该如何解决这个错误?

ps
值得注意的是,pixi.js.d.ts 不适合 es6。
我不得不换一条线。曾是 -

declare module 'pixi.js' {
    export = PIXI;
}

变成 -

declare module 'pixi.js' {
    export default PIXI;
}  

也许其他的东西需要改变?

更新:0.0.1

如果您按原样返回所有内容-

declare module 'pixi.js' {
    export = PIXI;
}

和写 -

import * as PIXI from 'pixi.js';

然后你得到错误 -

错误 TS1192:模块“pixi.js”没有默认导出。

4

2 回答 2

3

值得注意的是 pixi.js.d.ts 不适合 es6。我不得不改变一行

而不是改变定义,请import PIXI from 'pixi.js';改为import * as PIXI from 'pixi.js';

于 2015-08-24T00:19:49.473 回答
0

以下是如何将方法添加到 PIXI 以及扩展类型:

import * as PIXI from "pixi.js";

declare module "@pixi/graphics" {
  interface Graphics {
    drawDashedPolygon(
      polygons: PIXI.Point[],
      x: number,
      y: number,
      rotation: number,
      dash: number,
      gap: number,
      offsetPercentage: number
    ): void;
  }
}

// Extracted from https://github.com/pixijs/pixijs/issues/1333#issuecomment-379000150
PIXI.Graphics.prototype.drawDashedPolygon = function (
  polygons,
  x,
  y,
  rotation,
  dash,
  gap,
  offsetPercentage
) {
  let i;
  let p1;
  let p2;
  let dashLeft = 0;
  let gapLeft = 0;
  if (offsetPercentage > 0) {
    const progressOffset = (dash + gap) * offsetPercentage;
    if (progressOffset < dash) dashLeft = dash - progressOffset;
    else gapLeft = gap - (progressOffset - dash);
  }
  const rotatedPolygons = [];
  for (i = 0; i < polygons.length; i++) {
    const p = { x: polygons[i].x, y: polygons[i].y };
    const cosAngle = Math.cos(rotation);
    const sinAngle = Math.sin(rotation);
    const dx = p.x;
    const dy = p.y;
    p.x = dx * cosAngle - dy * sinAngle;
    p.y = dx * sinAngle + dy * cosAngle;
    rotatedPolygons.push(p);
  }
  for (i = 0; i < rotatedPolygons.length; i++) {
    p1 = rotatedPolygons[i];
    if (i == rotatedPolygons.length - 1) p2 = rotatedPolygons[0];
    else p2 = rotatedPolygons[i + 1];
    const dx = p2.x - p1.x;
    const dy = p2.y - p1.y;
    const len = Math.sqrt(dx * dx + dy * dy);
    const normal = { x: dx / len, y: dy / len };
    let progressOnLine = 0;
    this.moveTo(x + p1.x + gapLeft * normal.x, y + p1.y + gapLeft * normal.y);
    while (progressOnLine <= len) {
      progressOnLine += gapLeft;
      if (dashLeft > 0) progressOnLine += dashLeft;
      else progressOnLine += dash;
      if (progressOnLine > len) {
        dashLeft = progressOnLine - len;
        progressOnLine = len;
      } else {
        dashLeft = 0;
      }
      this.lineTo(
        x + p1.x + progressOnLine * normal.x,
        y + p1.y + progressOnLine * normal.y
      );
      progressOnLine += gap;
      if (progressOnLine > len && dashLeft == 0) {
        gapLeft = progressOnLine - len;
      } else {
        gapLeft = 0;
        this.moveTo(
          x + p1.x + progressOnLine * normal.x,
          y + p1.y + progressOnLine * normal.y
        );
      }
    }
  }
};
于 2021-09-13T18:48:57.237 回答