DEV Community

Cover image for I published a "useClude" hook using the "zod" library in npm.
Higashi-Kota
Higashi-Kota

Posted on

I published a "useClude" hook using the "zod" library in npm.

Hi, there.

I have released a "useClude" hook using the "zod" library in npm, so here is an introduction.

The repository is here.

https://github.com/Higashi-Kota/use-clude

The npm library is available here.

https://www.npmjs.com/package/@nap5/use-clude

Samples are placed in the examples directory of the Github repository.

We also have a typescript nextjs sample.

The simple usage is as follows.

First, create a project directory.

$ cd ~/wrksp
$ mkdir -p a
$ cd a
$ yarn init -y
$ yarn add @nap5/use-clude zod
$ mkdir -p data
$ touch data/bebop.json
$ touch index.js
Enter fullscreen mode Exit fullscreen mode

Prepare test data in the file data/bebop.json.

[
  {
    "id": "p9z7aek9fi",
    "name": "Landon Glover",
    "age": 38,
    "blogs": []
  },
  {
    "id": "pga7t8prpl",
    "name": "Jack Jackson",
    "age": 38,
    "blogs": [
      {
        "id": "1",
        "title": "AAA"
      },
      {
        "id": "2",
        "title": "BBB"
      },
      {
        "id": "3",
        "title": "CCC"
      }
    ]
  },
  {
    "id": "tcz4kesu6p",
    "name": "Grace Dennis",
    "age": 44,
    "blogs": [
      {
        "id": "4",
        "title": "DDD"
      }
    ]
  }
]
Enter fullscreen mode Exit fullscreen mode

Module handling in package.json.

{
  "type": "module",
  "dependencies": {
    "@nap5/use-clude": "^1.0.0",
    "zod": "^3.19.1"
  }
}
Enter fullscreen mode Exit fullscreen mode

Describe the execution in index.js.

import { z } from "zod";
import { useClude } from "@nap5/use-clude";
import { createRequire } from "module";
const require = createRequire(import.meta.url);
const data = require("./data/bebop.json");
const userShape = {
  id: z.string(),
  name: z.string(),
  age: z.number(),
  blogs: z
    .object({
      id: z.string(),
      title: z.string(),
    })
    .array(),
};
const { exclude, include } = useClude(userShape);
console.log(
  JSON.stringify(
    data.map((item) => include("blogs").parse(item)),
    null,
    2
  )
);
console.log(
  JSON.stringify(
    data.map((item) => exclude("name", "age").parse(item)),
    null,
    2
  )
);
Enter fullscreen mode Exit fullscreen mode

The following is the execution result.

Properties specified in "include" are included, and properties specified in "exclude" are excluded.

$ time node index.js
[
  {
    "blogs": []
  },
  {
    "blogs": [
      {
        "id": "1",
        "title": "AAA"
      },
      {
        "id": "2",
        "title": "BBB"
      },
      {
        "id": "3",
        "title": "CCC"
      }
    ]
  },
  {
    "blogs": [
      {
        "id": "4",
        "title": "DDD"
      }
    ]
  }
]
[
  {
    "id": "p9z7aek9fi",
    "blogs": []
  },
  {
    "id": "pga7t8prpl",
    "blogs": [
      {
        "id": "1",
        "title": "AAA"
      },
      {
        "id": "2",
        "title": "BBB"
      },
      {
        "id": "3",
        "title": "CCC"
      }
    ]
  },
  {
    "id": "tcz4kesu6p",
    "blogs": [
      {
        "id": "4",
        "title": "DDD"
      }
    ]
  }
]

real    0m0.040s
user    0m0.042s
sys     0m0.014s
Enter fullscreen mode Exit fullscreen mode

The following error was observed when publishing this library.
But although I could not resolve the error, the bundled file was outputted, so I just went with the flow and published it.

I looked for an option to relax in tscofing.json or something, but it was difficult to find.

 $ cd ~/wrksp/use-clude
 $ rm -rf dist && tsc  -p .
src/index.ts:5:17 - error TS2589: Type instantiation is excessively deep and possibly infinite.

5   type Record = z.infer<typeof record>;
                  ~~~~~~~~~~~~~~~~~~~~~~


Found 1 error.
Enter fullscreen mode Exit fullscreen mode

If you know how to mitigate this error setting, please let me know.

error TS2589: Type instantiation is excessively deep and possibly infinite.
Enter fullscreen mode Exit fullscreen mode

Cheers.

Higashi Kota

Top comments (2)

Collapse
 
naucode profile image
Al - Naucode

Hey! Thank you for this, I liked it ;) keep writing, you got my follow!

Collapse
 
higashikota profile image
Higashi-Kota

Thank you.