How to use Gulp to contribute? (Failed to build)

Hello,

I wanted to submit a PR, so I followed the contributing pages, but I failed at this step:

In your CLI make sure your are in the directory Babylon.js/Tools/Gulp and enter

npm install
npm run build

npm run build fails because the script doesn’t exist in package.json. Seems legit.
Of course, same thing for npm run start.

And trying to run directly gulp run fails too:

$ gulp run
[12:26:51] Using gulpfile /mnt/d/DONNEES/DEV/Git/Babylon.js/Tools/Gulp/gulpfile.js
[12:26:51] Starting 'run'...
[12:26:51] Starting 'watch'...
[12:26:51] Starting 'srcTscWatch'...
[12:26:52 PM] Starting compilation in watch mode...

../../src/Cameras/Inputs/babylon.arcRotateCameraMouseWheelInput.ts:25:27 - error TS2339: Property 'wheelDelta' does not exist on type 'WheelEvent'.

25                 if (event.wheelDelta) {
                             ~~~~~~~~~~

../../src/Cameras/Inputs/babylon.arcRotateCameraMouseWheelInput.ts:27:49 - error TS2339: Property 'wheelDelta' does not exist on type 'WheelEvent'.

27                         var wheelDelta = (event.wheelDelta * 0.01 * this.wheelDeltaPercentage) * this.camera.radius;
                                                   ~~~~~~~~~~

../../src/Cameras/Inputs/babylon.arcRotateCameraMouseWheelInput.ts:28:35 - error TS2339: Property 'wheelDelta' does not exist on type 'WheelEvent'.

28                         if (event.wheelDelta > 0) {
                                     ~~~~~~~~~~

../../src/Cameras/Inputs/babylon.arcRotateCameraMouseWheelInput.ts:34:39 - error TS2339: Property 'wheelDelta' does not exist on type 'WheelEvent'.

34                         delta = event.wheelDelta / (this.wheelPrecision * 40);
                                         ~~~~~~~~~~

../../src/Cameras/Inputs/babylon.arcRotateCameraPointersInput.ts:253:57 - error TS2769: No overload matches this call.
  Overload 1 of 2, '(type: "contextmenu", listener: (this: HTMLElement, ev: MouseEvent) => any, options?: boolean | AddEventListenerOptions | undefined): void', gave the following error.
    Argument of type '(e: PointerEvent) => void' is not assignable to parameter of type '(this: HTMLElement, ev: MouseEvent) => any'.
      Types of parameters 'e' and 'ev' are incompatible.
        Type 'MouseEvent' is missing the following properties from type 'PointerEvent': height, isPrimary, pointerId, pointerType, and 6 more.
  Overload 2 of 2, '(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void', gave the following error.
    Argument of type '(e: PointerEvent) => void' is not assignable to parameter of type 'EventListenerOrEventListenerObject'.
      Type '(e: PointerEvent) => void' is not assignable to type 'EventListener'.
        Types of parameters 'e' and 'evt' are incompatible.
          Type 'Event' is missing the following properties from type 'PointerEvent': height, isPrimary, pointerId, pointerType, and 36 more.

253                 element.addEventListener("contextmenu", this._onContextMenu, false);
                                                            ~~~~~~~~~~~~~~~~~~~


../../src/Cameras/Inputs/babylon.arcRotateCameraPointersInput.ts:329:64 - error TS2769: No overload matches this call.
  Overload 1 of 2, '(type: "contextmenu", listener: (this: HTMLElement, ev: MouseEvent) => any, options?: boolean | EventListenerOptions | undefined): void', gave the following error.
    Argument of type '(e: PointerEvent) => void' is not assignable to parameter of type '(this: HTMLElement, ev: MouseEvent) => any'.
      Types of parameters 'e' and 'ev' are incompatible.
        Type 'MouseEvent' is not assignable to type 'PointerEvent'.
  Overload 2 of 2, '(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions | undefined): void', gave the following error.
    Argument of type '(e: PointerEvent) => void' is not assignable to parameter of type 'EventListenerOrEventListenerObject'.
      Type '(e: PointerEvent) => void' is not assignable to type 'EventListener'.

329                     element.removeEventListener("contextmenu", this._onContextMenu);
                                                                   ~~~~~~~~~~~~~~~~~~~


../../src/Cameras/VR/babylon.vrExperienceHelper.ts:749:33 - error TS2339: Property 'webkitIsFullScreen' does not exist on type 'Document'.

749             } else if (document.webkitIsFullScreen !== undefined) {
                                    ~~~~~~~~~~~~~~~~~~

../../src/Cameras/VR/babylon.vrExperienceHelper.ts:750:57 - error TS2339: Property 'webkitIsFullScreen' does not exist on type 'Document'.

750                 this._fullscreenVRpresenting = document.webkitIsFullScreen;
                                                            ~~~~~~~~~~~~~~~~~~

../../src/Engine/babylon.engine.ts:927:17 - error TS2774: This condition will always return true since the function is always defined. Did you mean to call it instead?

927             if ((<HTMLCanvasElement>canvasOrContext).getContext) {
                    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

../../src/Engine/babylon.engine.ts:1103:17 - error TS2322: Type 'HTMLCanvasElement | OffscreenCanvas' is not assignable to type 'Nullable<HTMLCanvasElement>'.
  Type 'OffscreenCanvas' is missing the following properties from type 'HTMLCanvasElement': toBlob, toDataURL, transferControlToOffscreen, isRecording, and 235 more.

1103                 this._renderingCanvas = this._gl.canvas
                     ~~~~~~~~~~~~~~~~~~~~~

../../src/Engine/babylon.engine.ts:1105:21 - error TS2774: This condition will always return true since the function is always defined. Did you mean to call it instead?

1105                 if (this._gl.renderbufferStorageMultisample) {
                         ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

../../src/Engine/babylon.engine.ts:1109:35 - error TS2531: Object is possibly 'null'.

1109                 options.stencil = this._gl.getContextAttributes().stencil;
                                       ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

../../src/Engine/babylon.engine.ts:1127:41 - error TS2339: Property 'webkitIsFullScreen' does not exist on type 'Document'.

1127                     } else if (document.webkitIsFullScreen !== undefined) {
                                             ~~~~~~~~~~~~~~~~~~

../../src/Engine/babylon.engine.ts:1128:54 - error TS2339: Property 'webkitIsFullScreen' does not exist on type 'Document'.

1128                         this.isFullscreen = document.webkitIsFullScreen;
                                                          ~~~~~~~~~~~~~~~~~~

../../src/Engine/babylon.engine.ts:2065:17 - error TS2774: This condition will always return true since the function is always defined. Did you mean to call it instead?

2065             if (this.onResizeObservable.hasObservers) {
                     ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

../../src/Engine/babylon.engine.ts:3213:29 - error TS2345: Argument of type 'WebGLShader | null' is not assignable to parameter of type 'WebGLShader'.
  Type 'null' is not assignable to type 'WebGLShader'.

3213             gl.shaderSource(shader, source);
                                 ~~~~~~

../../src/Engine/babylon.engine.ts:3214:30 - error TS2345: Argument of type 'WebGLShader | null' is not assignable to parameter of type 'WebGLShader'.
  Type 'null' is not assignable to type 'WebGLShader'.

3214             gl.compileShader(shader);
                                  ~~~~~~

../../src/Engine/babylon.engine.ts:3216:40 - error TS2345: Argument of type 'WebGLShader | null' is not assignable to parameter of type 'WebGLShader'.
  Type 'null' is not assignable to type 'WebGLShader'.

3216             if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
                                            ~~~~~~

../../src/Engine/babylon.engine.ts:3217:47 - error TS2345: Argument of type 'WebGLShader | null' is not assignable to parameter of type 'WebGLShader'.
  Type 'null' is not assignable to type 'WebGLShader'.

3217                 let log = gl.getShaderInfoLog(shader);
                                                   ~~~~~~

../../src/Gamepad/babylon.gamepadManager.ts:73:17 - error TS2774: This condition will always return true since the function is always defined. Did you mean to call it instead?

73             if (this._gamepadSupport) {
                   ~~~~~~~~~~~~~~~~~~~~

../../src/Loading/babylon.sceneLoader.ts:254:17 - error TS2774: This condition will always return true since the function is always defined. Did you mean to call it instead?

254             if ((registeredPlugin.plugin as ISceneLoaderPluginFactory).createPlugin) {
                    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

../../src/Math/babylon.math.ts:5954:17 - error TS2774: This condition will always return true since the function is always defined. Did you mean to call it instead?

5954             if ((<Engine>renderWidthOrEngine).getRenderWidth) {
                     ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

../../src/Mesh/Compression/babylon.dracoCompression.ts:2:13 - error TS2300: Duplicate identifier 'WebAssembly'.

2 declare var WebAssembly: any;
              ~~~~~~~~~~~

  node_modules/typescript/lib/lib.dom.d.ts:18967:19
    18967 declare namespace WebAssembly {
                            ~~~~~~~~~~~
    'WebAssembly' was also declared here.

../../src/Mesh/babylon.abstractMesh.ts:315:17 - error TS2774: This condition will always return true since the function is always defined. Did you mean to call it instead?

315             if (this.onMaterialChangedObservable.hasObservers) {
                    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

../../src/Mesh/babylon.subMesh.ts:115:24 - error TS2774: This condition will always return true since the function is always defined. Did you mean to call it instead?

115             } else if ((<MultiMaterial>rootMaterial).getSubMaterial) {
                           ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

../../src/Morph/babylon.morphTarget.ts:38:17 - error TS2774: This condition will always return true since the function is always defined. Did you mean to call it instead?

38             if (this.onInfluenceChanged.hasObservers) {
                   ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

../../src/Tools/babylon.assetsManager.ts:434:13 - error TS2322: Type '(err: ErrorEvent) => any' is not assignable to type 'OnErrorEventHandler'.
  Types of parameters 'err' and 'event' are incompatible.
    Type 'string | Event' is not assignable to type 'ErrorEvent'.
      Type 'string' is not assignable to type 'ErrorEvent'.

434             img.onerror = (err: ErrorEvent): any => {
                ~~~~~~~~~~~

../../src/Tools/babylon.promise.ts:77:34 - error TS2352: Conversion of type 'void' to type 'InternalPromise<T>' may be a mistake because neither type sufficiently overlaps with the other. If this was intentional, convert the expression to 'unknown' first.

77                             if ((<InternalPromise<T>>returnedValue)._state !== undefined) {
                                    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

../../src/Tools/babylon.promise.ts:78:55 - error TS2352: Conversion of type 'void' to type 'InternalPromise<T>' may be a mistake because neither type sufficiently overlaps with the other. If this was intentional, convert the expression to 'unknown' first.

78                                 let returnedPromise = returnedValue as InternalPromise<T>;
                                                         ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

../../src/Tools/babylon.promise.ts:83:55 - error TS2352: Conversion of type 'void' to type 'T' may be a mistake because neither type sufficiently overlaps with the other. If this was intentional, convert the expression to 'unknown' first.
  'T' could be instantiated with an arbitrary type which could be unrelated to 'void'.

83                                 newPromise._result = (<T>returnedValue);
                                                         ~~~~~~~~~~~~~~~~

../../src/Tools/babylon.tools.ts:220:55 - error TS2339: Property 'setImmediate' does not exist on type 'Window & typeof globalThis'.

220             if (Tools.IsWindowObjectExist() && window.setImmediate) {
                                                          ~~~~~~~~~~~~

../../src/Tools/babylon.tools.ts:221:24 - error TS2339: Property 'setImmediate' does not exist on type 'Window & typeof globalThis'.

221                 window.setImmediate(action);
                           ~~~~~~~~~~~~

../../src/Tools/babylon.tools.ts:542:110 - error TS2339: Property 'webkitRequestFullscreen' does not exist on type 'HTMLElement'.

542             var requestFunction = element.requestFullscreen || (<any>element).msRequestFullscreen || element.webkitRequestFullscreen || (<any>element).mozRequestFullScreen;
                                                                                                                 ~~~~~~~~~~~~~~~~~~~~~~~

../../src/Tools/babylon.tools.ts:554:31 - error TS2339: Property 'webkitCancelFullScreen' does not exist on type 'Document'.

554             else if (document.webkitCancelFullScreen) {
                                  ~~~~~~~~~~~~~~~~~~~~~~

../../src/Tools/babylon.tools.ts:555:26 - error TS2339: Property 'webkitCancelFullScreen' does not exist on type 'Document'.

555                 document.webkitCancelFullScreen();
                             ~~~~~~~~~~~~~~~~~~~~~~

../../src/Tools/babylon.tools.ts:1596:17 - error TS2774: This condition will always return true since the function is always defined. Did you mean to call it instead?

1596             if (console.time) {
                     ~~~~~~~~~~~~

../../src/Tools/babylon.virtualJoystick.ts:121:48 - error TS2551: Property 'msTouchAction' does not exist on type 'CSSStyleDeclaration'. Did you mean 'touchAction'?

121                 VirtualJoystick.vjCanvas.style.msTouchAction = "none";
                                                   ~~~~~~~~~~~~~

  node_modules/typescript/lib/lib.dom.d.ts:3045:5
    3045     touchAction: string;
             ~~~~~~~~~~~
    'touchAction' is declared here.

../../src/babylon.mixins.ts:93:5 - error TS2687: All declarations of 'fullscreen' must have identical modifiers.

93     fullscreen: boolean;
       ~~~~~~~~~~

../../src/babylon.mixins.ts:145:5 - error TS2687: All declarations of 'orientation' must have identical modifiers.

145     orientation: string;
        ~~~~~~~~~~~

../../src/babylon.mixins.ts:145:5 - error TS2717: Subsequent property declarations must have the same type.  Property 'orientation' must be of type 'ScreenOrientation', but here has type 'string'.

145     orientation: string;
        ~~~~~~~~~~~

  node_modules/typescript/lib/lib.dom.d.ts:14752:14
    14752     readonly orientation: ScreenOrientation;
                       ~~~~~~~~~~~
    'orientation' was also declared here.

../../src/babylon.scene.ts:1147:17 - error TS2774: This condition will always return true since the function is always defined. Did you mean to call it instead?

1147             if (serializableComponent.addFromContainer) {
                     ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

[12:27:05 PM] Found 41 errors. Watching for file changes.

[12:27:05] Finished 'srcTscWatch' after 14 s
[12:27:05] Starting 'startWatch'...
[12:27:05] 'startWatch' errored after 7.55 ms
[12:27:05] TypeError: expected a string
    at module.exports (/mnt/d/DONNEES/DEV/Git/Babylon.js/Tools/Gulp/node_modules/is-negated-glob/index.js:5:11)
    at sortGlobs (/mnt/d/DONNEES/DEV/Git/Babylon.js/Tools/Gulp/node_modules/glob-watcher/index.js:67:18)
    at Array.forEach (<anonymous>)
    at watch (/mnt/d/DONNEES/DEV/Git/Babylon.js/Tools/Gulp/node_modules/glob-watcher/index.js:64:18)
    at Gulp.watch (/mnt/d/DONNEES/DEV/Git/Babylon.js/Tools/Gulp/node_modules/gulp/index.js:48:10)
    at /mnt/d/DONNEES/DEV/Git/Babylon.js/Tools/Gulp/gulpfile.js:726:33
    at Array.map (<anonymous>)
    at /mnt/d/DONNEES/DEV/Git/Babylon.js/Tools/Gulp/gulpfile.js:704:34
    at Array.map (<anonymous>)
    at startWatch (/mnt/d/DONNEES/DEV/Git/Babylon.js/Tools/Gulp/gulpfile.js:702:20)
    at bound (domain.js:396:14)
    at runBound (domain.js:409:12)
    at asyncRunner (/mnt/d/DONNEES/DEV/Git/Babylon.js/Tools/Gulp/node_modules/async-done/index.js:55:18)
    at process._tickCallback (internal/process/next_tick.js:61:11)
[12:27:05] 'watch' errored after 14 s
[12:27:05] 'run' errored after 14 s

Just in case:
image

Is the doc outdated or am I missing something obvious?

could you share the result of your npm run build command ???

If you are in the tools/gulp folder, it should definitely not happen as the command is there: Babylon.js/package.json at master · BabylonJS/Babylon.js · GitHub

WTF, I forked the repo yesterday, I didn’t make any change and my package.json doesn’t look like that at all. I surely have an old version but how is it possible?

And as I forked yesterday, I’m of course up to date:
image

npm run build only says npm ERR! missing script: build, which is totally normal with my package.json:

{
    "name": "BabylonJS",
    "version": "3.1.1",
    "description": "Babylon.js is a 3D engine based on webgl and javascript",
    "main": "",
    "repository": {
        "url": "https://github.com/BabylonJS/Babylon.js/"
    },
    "readme": "https://github.com/BabylonJS/Babylon.js/edit/master/readme.md",
    "license": "(Apache-2.0)",
    "devDependencies": {
        "@types/node": "^8.10.22",
        "chai": "^4.1.2",
        "color-support": "^1.1.3",
        "del": "3.0.0",
        "gulp": "^4.0.0",
        "gulp-clean-ts-extends": "~0.1.1",
        "gulp-concat": "~2.6.1",
        "gulp-content-to-variable": "^0.1.0",
        "gulp-debug": "^4.0.0",
        "gulp-expect-file": "^1.0.0",
        "gulp-optimize-js": "^1.1.0",
        "gulp-rename": "^1.4.0",
        "gulp-replace": "~1.0.0",
        "gulp-sourcemaps": "~2.6.4",
        "gulp-typedoc": "^2.2.0",
        "gulp-typescript": "4.0.2",
        "gulp-uglify": "^3.0.1",
        "gulp-webserver": "^0.9.1",
        "karma": "^2.0.5",
        "karma-browserstack-launcher": "^1.3.0",
        "karma-chai": "^0.1.0",
        "karma-chrome-launcher": "^2.2.0",
        "karma-firefox-launcher": "^1.1.0",
        "karma-mocha": "^1.3.0",
        "karma-phantomjs-launcher": "^1.0.4",
        "karma-sinon": "^1.0.5",
        "merge2": "~1.2.2",
        "minimist": "^1.2.0",
        "mocha": "^5.2.0",
        "phantomjs-prebuilt": "^2.1.16",
        "sinon": "^6.1.4",
        "through2": "~2.0.3",
        "ts-loader": "^4.4.2",
        "typedoc": "^0.11.0",
        "typescript": "^3.0.1",
        "webpack": "^4.16.3",
        "webpack-stream": "5.0.0"
    },
    "scripts": {
        "install": "cd ../../gui && npm install && cd ../Tools/Gulp/ &&  cd ../../inspector && npm install && cd ../Tools/Gulp/ && npm --prefix ../../Playground/ install ../../Playground/ && npm --prefix ../../tests/unit/ install ../../tests/unit/ && npm --prefix ../../Viewer/tests/ install ../../Viewer/tests/ && cd ../../Viewer && npm install && cd ../Tools/Gulp/ && gulp deployLocalDev"
    },
    "dependencies": {
        "dts-bundle": "^0.7.3",
        "gulp-clean": "^0.4.0"
    }
}

Mmh, I will just clone the repo again but that’s really, really weird.

Thank you @sebavan

yup looks amazingly old not idea how you could have that…

This is surely 100% my fault and a wrong git config, as I’m quite sure this is the version of the last time I worked with BabylonJS.
Sorry for inconvenience.

Edit: Yes I was convinced to be using a fresh new fork but I actually used the very old one.

1 Like