npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@naturalcycles/dev-lib

v15.28.1

Published

Set of opinionated configuration files and tools for common project needs

Downloads

5,341

Readme

@naturalcycles/dev-lib

Set of opinionated configuration files and tools for common project needs, to be shared between all modules. Enforces conventions between projects.

npm install size Maintainability Test Coverage code style: prettier Known Vulnerabilities Actions

Tools that dev-lib enables

  • Prettier
  • ESLint
  • Biome
  • Stylelint
  • Jest
  • ktlint
  • actionlint
  • lint-staged

How to use

Install it:

yarn add -D @naturalcycles/dev-lib

This unlocks all commands listed below, e.g:

yarn dev-lib test
yarn dev-lib lint

yarn dev-lib runs "interactive mode" that lets you explore available commands.

By default, it uses default configs for Prettier, ESLint, Stylelint, that are included in this package (for convenience). You can override them by putting your own prettier.config.js, eslint.config.js, stylelint.config.js in the root folder of your project.

UPD: these tools/linters would use default configs if absent:

  • commitlint
  • lint-staged

These tools require a respective config to run, otherwise they're not run. List of configs:

  • jest.config.js
  • prettier.config.js
  • eslint.config.js (eslint FLAT config)
  • stylelint.config.js

Conventions

Primary language: TypeScript (*.ts).

All files are linted and prettified upon commit (using husky, lint-staged and prettier).

Folder structure

  • /dist target dir to put compiled files into (*.js and additional files like *.json)
  • /dist-cjs target for CommonJS files
  • /dist-esm target for ES Modules
  • /src for all source files
  • /scripts for all non-production source files / scripts.
  • /src/test for generic test-related files and utilities, integration tests.
  • /src/test/mock
  • /src/@types
  • /src/env
  • /cfg conventional folder to store and publish shared configs. E.g. shared tsconfig.json or such.
  • /resources files that will be published to npm, but that are not "source code". E.g. json files, schemas, configs, etc.
  • /coverage for unit test coverage
  • /tmp
    • /jest/unit.xml
    • /jest/integration.xml
    • /coverage-integration
  • /docs for Docs (convention followed by Github Pages, Conventional commits, Vitepress, etc)

Yarn commands

These commands are available to be called as yarn dev-lib <command>.

Build commands

  • build: "Production build". Does del ./dist && build-copy && tsc-prod
  • bt: "Build & Test". Does del ./dist && tsc && tsc-scripts && test
  • lbt: "Lint, Build & Test". Does lint && tsc && test
  • build-esm-cjs: "Production build" for browser-lib, will produce CJS output in ./dist and ESM output in ./dist-esm. Will use ./tsconfig.{cjs|esm}.prod.json if exists, otherwise tsconfig.prod.json, which allows to override e.g compilation target.

Test commands

There are 3 categories of tests supported:

  • Unit tests (default) *.test.ts
  • Integration tests *.integration.test.ts
  • Manual tests *.manual.test.ts

Unit tests are default. All tests are run on yarn dev-lib test.

Integration tests (optional) allow to have a setup file (src/test/setupJest.integration.ts) where you can define separate environment settings. You can use it to run so-called "integration tests" - tests that interface with outside world (network, DB, APIs, etc). While unit tests are restricted to not use network calls.

Manual tests (optional) are sub-category of integration tests that you never want to run automatically in any environment. They're useful to run tests manually every now and then.

All test commands set TZ=UTC. You can override it by providing TZ env variable before running a test command. Adds APP_ENV=test env var (for all runs except integration). Automatically adds --silent (and JEST_SILENT env var) if all tests are run.

  • test: runs unit tests (all tests except *.integration.test.ts and *.manual.test.ts). Detects CI env variable, adds --coverage if in CI. Uses default reporter in !CI, otherwise jest-junit reporter.
  • test-integration: runs *.integration.test.ts with jest.integration-test.config.js config.
  • test-manual: runs *.manual.test.ts with jest.manual-test.config.js.
  • test-leaks: runs Jest with --logHeapUsage --detectOpenHandles --detectLeaks.

For unit tests (yarn test) these setupFilesAfterEnv will be used (if found) in that order:

  • <rootDir>/src/test/setupJest.ts
  • <rootDir>/src/test/setupJest.unit.ts

For integration tests (yarn test-integration) these setupFilesAfterEnv will be used (if found) in that order:

  • <rootDir>/src/test/setupJest.ts
  • <rootDir>/src/test/setupJest.integration.ts

For manual tests:

  • <rootDir>/src/test/setupJest.ts
  • <rootDir>/src/test/setupJest.manual.ts

yarn dev-lib test runs tests in alphabetic order by default (internally it points --testSequencer to a pre-defined sequencer file that sorts all filenames alphabetically). Set JEST_NO_ALPHABETIC env variable to disable it.

Shard support

Jest 28 introduced --shard feature.

Set JEST_SHARDS environment variable (e.g export JEST_SHARDS=3), so that your yarn test* commands will automatically split your tests by N number of shards and execute them one after another (serially, not in parallel). Might be helpful to avoid Jest's notorious memory leaks.

If you need to execute shards in parallel, you can follow e.g this instruction.

Lint commands

  • lint: runs Biome, ESLint, Stylelint, Prettier, actionlint, ktlint in the right order.

    • --commitOnChanges will commit lint-modified changes and push them
    • --failOnChanges will exit with status 1 in the end (will fail the command)
  • eslint: runs eslint on needed paths

  • biome: runs biome on needed paths

  • stylelint: runs stylelint on needed paths

  • prettier: runs just Prettier on needed paths

Pass --no-fix (or --fix=false) to disable the default --fix flag on linters. Useful to debug a linter, or when linter behaves badly and corrupts your files (just happened to me with eslint-plugin-vue).

Pass --ext (e.g --ext ts,html) to override the list of ESLint extensions (default is ts,tsx,vue right now).

For Stylelint to be run, you need to manually install it in the target project:

yarn add -D stylelint stylelint-config-standard-scss

For Biome to run you need to install it like this:

yarn add -D @biomejs/biome

and add biome.jsonc config to the root.

ktlint

ktlint will be used by lint-staged for all **/*.{kt,kts} files.

~~Please install it with brew install ktlint.~~

Install it locally in you project by adding @naturalcycles/ktlint to your devDependencies.

Other commands

  • up: shortcut for yarn upgrade && yarn patch-package (if patch-package exists in the project).

Non-extendable config files

These files cannot be extended, so they are instead copied into the target project: first time when seeding the project, later manually by running yarn update-from-dev-lib.

These files are overwritten in target project every time the mentioned command is run. So, be careful! Solution is to either extend them in other way (e.g put more .gitignore files in subfolders), OR PR to this project, if the need is generic.

  • .editorconfig
  • .gitignore
  • .codeclimate.yml (with some work it can be made extendable later)

Extendable config files

These files are meant to be extended in target project, so act as recommended defaults.

  • husky.config.js
  • lint-staged.config.js
  • prettier.config.js
  • eslint.config.js
  • biome.jsonc
  • jest.config.js

eslint

Presence of jest is detected by checking if node_modules/jest exists.

If exists - eslint-plugin-jest recommended config (plus opinionated dev-lib's rules) are enabled. Otherwise disabled ( to not cause "jest not found" errors).