@oskartdragon/config v0.1.3

Install

npm install @oskar-dragon/config

!WARNING To be able to install this package in your project, please make sure you have: 1. Generated your Personal Access Token for GitHub. 2. Authenticated on the command line using your Personal Access Token.

From the permissions select at least read:packages

These steps are necessary to install and work packages.

Prettier

The easiest way to use this config is in your package.json:

"prettier": "@oskar-dragon/config/prettier"

If you want to customise things, you should probably just copy/paste the built-in config. But if you really want, you can override it using regular JavaScript.

Create a .prettierrc.js file in your project root with the following content:

import defaultConfig from '@oskar-dragon/config/prettier'

/** @type {import("prettier").Options} */
export default {
	...defaultConfig,
	// .. your overrides here...
}

TypeScript

Create a tsconfig.json file in your project root with the following content:

{
	"extends": "@oskar-dragon/config/bundler/no-dom/app",
	"include": [
		"**/*.ts",
		"**/*.tsx",
		"**/*.js",
		"**/*.jsx"
	],
	// If you use absolute paths, you have to add the below
	"compilerOptions": {
		"baseUrl": ".",
	    "paths": {
	      "@/*": ["./src/*"]
	    }
	}
}

If you want to Learn more from the TypeScript docs here.

List of TSConfigs

As you probably know, there's no single tsconfig.json configuration that works for everything. Most of the time, you're probably using an external bundler like esbuild, tsup or Vite. If so, use this selection of configs:

{
  // My code runs in the DOM:
  "extends": "@oskar-dragon/config/tsconfig/bundler/dom/app", // For an app
  "extends": "@oskar-dragon/config/tsconfig/bundler/dom/library", // For a library

  // My code _doesn't_ run in the DOM (for instance, in Node.js):
  "extends": "@oskar-dragon/config/tsconfig/bundler/no-dom/app", // For an app
  "extends": "@oskar-dragon/config/tsconfig/bundler/no-dom/library", // For a library
}

jsx

If your app has JSX, you can set the jsx option in your tsconfig.json:

{
  "extends": "@oskar-dragon/config/tsconfig/bundler/dom/app",
  "compilerOptions": {
    "jsx": "react-jsx"
  }
}

ESLint

Create a eslint.config.js file in your project root with the following content:

import { config as defaultConfig } from '@eoskar-dragon/config/eslint'

/** @type {import("eslint").Linter.Config} */
export default [...defaultConfig]

If you want to customise your config, earn more from the Eslint docs here.