Unable to import certain rules

[chanp-ark]

I want to import all the rules except the json rule. Doing so triggers a lint error:

• ESLint: Unable to resolve path to module '@total-typescript/ts-reset/array-includes'.(import/no-unresolved)

In package.json, I have:

"dependencies": {
    "@total-typescript/ts-reset": "0.4.2"
}

In src/reset.d.ts: I have

import '@total-typescript/ts-reset/array-includes';
import '@total-typescript/ts-reset/array-index-of';
import '@total-typescript/ts-reset/filter-boolean';
import '@total-typescript/ts-reset/is-array';
import '@total-typescript/ts-reset/map-has';
import '@total-typescript/ts-reset/set-has';
import '@total-typescript/ts-reset/utils';

In case this was just a lint issue, I checked how filter would do:

I also tried installing those specific rules in the package.json without success.

[Villae]

I had same problem and adding /dist part to the path fixed it:

import '@total-typescript/ts-reset/dist/fetch';

[chanp-ark]

@mattpocock can we update the docs to have dist in the path?

[ArthurKa]

@chanp-ark, what VS Code extension do you use to see type declarations inline?

[mattpocock]

@chanp-ark What tsconfig options do you have? Specifically, for moduleResolution?

[ReinisV]

happens for me too, importing whole package works fine, but if I want to use specific rules only, then adding dist is required.

my tsconfig.json:

{
  "compilerOptions": {
    "target": "esnext",
    "module": "esnext",
    "strict": true,
    "noImplicitAny": true, 
    "jsx": "preserve",
    "jsxFactory": "VueTsxSupport",
    "importHelpers": true,
    "moduleResolution": "node",
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "forceConsistentCasingInFileNames": true,
    "allowJs": false,
    "useDefineForClassFields": true,
    "sourceMap": true,
    "baseUrl": ".",
    "experimentalDecorators": true,
    "types": [
      "webpack-env",
      "jquery",
      "resize-observer-browser" 
    ],
    "paths": {
      // omitted for briefness
    },
    "lib": [
      "esnext",
      "dom",
      "dom.iterable",
      "scripthost"
    ]
  },
  "include": [
    "src/**/*.ts",
    "src/**/*.tsx",
    "src/**/*.vue",
    "tests/**/*.ts",
    "tests/**/*.tsx"
  ],
  "exclude": [
    "node_modules/*",
  ]
}

[chanp-ark]

@chanp-ark What tsconfig options do you have? Specifically, for moduleResolution?

"moduleResolution": "node", is what I have! The following is the rest of my tsconfig. Thanks!

{
  "compilerOptions": {
    "target": "es6",
    "lib": [
      "DOM",
      "DOM.Iterable",
      "ESNext"
    ],
    "allowJs": false,
    "skipLibCheck": true,
    "strict": true,
    "noImplicitAny": true,
    "forceConsistentCasingInFileNames": true,
    "noEmit": true,
    "esModuleInterop": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "preserve",
    "baseUrl": ".",
    "incremental": true,
    "plugins": [
      {
        "name": "next"
      }
    ]
  },
  "include": [
    "next-env.d.ts",
    "i18next.d.ts",
    "**/*.ts",
    "**/*.tsx",
    ".next/types/**/*.ts"
  ],
  "exclude": [
    "cypress",
    "node_modules"
  ]
}

[mattpocock]

As it says in the docs, you need to have moduleResolution: "nodenext" or moduleResolution: "node16" to let you import ts-reset.

Could you try adding that?

[ArthurKa]

Or just import it in correct way like

{
  "compilerOptions": {
    "types": [
      "webpack-env",
      "jquery",
      "resize-observer-browser",
      "@total-typescript/ts-reset/dist/fetch",
    ],
  },
}

[mattpocock]

@ArthurKa This is NOT recommended because if you specify one member of types, you need to specify all of them.

[tylerlaprade]

As it says in the docs, you need to have moduleResolution: "nodenext" or moduleResolution: "node16" to let you import ts-reset.

@mattpocock, first, thank you for this amazing library! It's the most excited I've been about TypeScript in about a year.

I'm not sure which docs you are referring to here. Do you mean ts-reset or TypeScript itself?

A search in this repo only turns up Issues and Discussions, no docs.

A search on totaltypescript.com/ts-reset only turns up generic TypeScript tutorials, not ts-reset specific results.

[mattpocock]

@tylerlaprade The link to the docs is in the readme of this project.

[tylerlaprade]

Found it, thanks! I was looking at the docs, but it was not visually easy to distinguish that section, so I had been relying on the site's search functionality mentioned above.