Deno•14mo ago•

3 replies

Cannot assign number to "number | undefined" when using package.json

Hi. I'm having odd behavior when using a newly created Vite vanilla TypeScript template using

deno init --npm vite@latest

deno init --npm vite@latest

. Right after initialization I'm installing the game library https://www.npmjs.com/package/excalibur. A game object in the engine is written like this:

import * as ex from "excalibur";

class GameObject extends ex.Actor {
  constructor(args: ex.ActorArgs) {
    super({
      ...args,    
      width: 16,
      height: 16
    });
  }
}

import * as ex from "excalibur";

class GameObject extends ex.Actor {
  constructor(args: ex.ActorArgs) {
    super({
      ...args,    
      width: 16,
      height: 16
    });
  }
}

but the lsp shows error on the

width

width

and

height

height

properties. It says

Type 'number' is not assignable to type 'undefined'.

though they are both a type of

number | undefined

number | undefined

. If I replace the package.json file with a deno.json file and reinstalls the node_modules it all works. I have tested on two machines. Is it a bug or am I missing something?

Here is how I reproduce:
1. Run

deno init --npm vite@latest test-exc

deno init --npm vite@latest test-exc

, select Vanilla, select TypeScript
2. Run

deno install

deno install

inside the project.
3. Add the Excalibur dependency with

deno add npm:excalibur

deno add npm:excalibur

4. Replace the contents of main.ts with

import * as ex from "excalibur";

class GameObject extends ex.Actor {
  constructor(args: ex.ActorArgs) {
    super({
      ...args,
      width: 16,
      height: 16,
    });
  }
}

import * as ex from "excalibur";

class GameObject extends ex.Actor {
  constructor(args: ex.ActorArgs) {
    super({
      ...args,
      width: 16,
      height: 16,
    });
  }
}

5. At this point I have errors on

width

width

and

height

height

.
6. Delete the package.json and create a deno.json file with this content:

{
  "tasks": {
    "dev": "deno run -A --node-modules-dir npm:vite",
    "build": "deno run -A --node-modules-dir npm:vite build",
    "serve": "deno run --allow-net --allow-read https://deno.land/std@0.157.0/http/file_server.ts dist/"
  },
  "imports": {
    "excalibur": "npm:excalibur@^0.29.3",
    "vite": "npm:vite@^5.4.8"
  },
  "compilerOptions": {
    "lib": [
      "deno.window",
      "DOM"
    ]
  },
  "lint": {
    "exclude": [
      "dist"
    ]
  }
}

{
  "tasks": {
    "dev": "deno run -A --node-modules-dir npm:vite",
    "build": "deno run -A --node-modules-dir npm:vite build",
    "serve": "deno run --allow-net --allow-read https://deno.land/std@0.157.0/http/file_server.ts dist/"
  },
  "imports": {
    "excalibur": "npm:excalibur@^0.29.3",
    "vite": "npm:vite@^5.4.8"
  },
  "compilerOptions": {
    "lib": [
      "deno.window",
      "DOM"
    ]
  },
  "lint": {
    "exclude": [
      "dist"
    ]
  }
}

6. Fix the import to

npm:excalibur

npm:excalibur

, remove the node_modules folder, and reinstall with

deno install

deno install

.
7: Errors are gone.

Cannot assign number to "number | undefined" when using package.json

Hi. I'm having odd behavior when using a newly created Vite vanilla TypeScript template using

deno init --npm vite@latest

deno init --npm vite@latest

. Right after initialization I'm installing the game library https://www.npmjs.com/package/excalibur. A game object in the engine is written like this:

import * as ex from "excalibur";

class GameObject extends ex.Actor {
  constructor(args: ex.ActorArgs) {
    super({
      ...args,    
      width: 16,
      height: 16
    });
  }
}

import * as ex from "excalibur";

class GameObject extends ex.Actor {
  constructor(args: ex.ActorArgs) {
    super({
      ...args,    
      width: 16,
      height: 16
    });
  }
}

but the lsp shows error on the

width

width

and

height

height

properties. It says

Type 'number' is not assignable to type 'undefined'.

though they are both a type of

number | undefined

number | undefined

deno init --npm vite@latest test-exc

deno init --npm vite@latest test-exc

, select Vanilla, select TypeScript
2. Run

deno install

deno install

inside the project.
3. Add the Excalibur dependency with

deno add npm:excalibur

deno add npm:excalibur

4. Replace the contents of main.ts with

import * as ex from "excalibur";

class GameObject extends ex.Actor {
  constructor(args: ex.ActorArgs) {
    super({
      ...args,
      width: 16,
      height: 16,
    });
  }
}

import * as ex from "excalibur";

class GameObject extends ex.Actor {
  constructor(args: ex.ActorArgs) {
    super({
      ...args,
      width: 16,
      height: 16,
    });
  }
}

5. At this point I have errors on

width

width

and

height

height

.
6. Delete the package.json and create a deno.json file with this content:

{
  "tasks": {
    "dev": "deno run -A --node-modules-dir npm:vite",
    "build": "deno run -A --node-modules-dir npm:vite build",
    "serve": "deno run --allow-net --allow-read https://deno.land/std@0.157.0/http/file_server.ts dist/"
  },
  "imports": {
    "excalibur": "npm:excalibur@^0.29.3",
    "vite": "npm:vite@^5.4.8"
  },
  "compilerOptions": {
    "lib": [
      "deno.window",
      "DOM"
    ]
  },
  "lint": {
    "exclude": [
      "dist"
    ]
  }
}

{
  "tasks": {
    "dev": "deno run -A --node-modules-dir npm:vite",
    "build": "deno run -A --node-modules-dir npm:vite build",
    "serve": "deno run --allow-net --allow-read https://deno.land/std@0.157.0/http/file_server.ts dist/"
  },
  "imports": {
    "excalibur": "npm:excalibur@^0.29.3",
    "vite": "npm:vite@^5.4.8"
  },
  "compilerOptions": {
    "lib": [
      "deno.window",
      "DOM"
    ]
  },
  "lint": {
    "exclude": [
      "dist"
    ]
  }
}

6. Fix the import to

npm:excalibur

npm:excalibur

, remove the node_modules folder, and reinstall with

deno install

deno install

.
7: Errors are gone.

Cannot assign number to "number | undefined" when using package.json

Similar Threads

Cannot assign number to "number | undefined" when using package.json

Similar Threads

Similar Threads

Similar Threads