Generating new libraries

For a library named $lib, in directory $dir (common, gi, pando or sr at the moment) run:

nx g lib $dir-$lib --directory libs/$dir/$lib --importPath @genshin-optimizer/$dir/$lib

For example, generating the Star Rail UI library named sr-ui:

nx g lib sr-ui --directory libs/sr/ui --importPath @genshin-optimizer/sr/ui

Linting setup

Please update .eslintrc.json with this new section, replacing $dir and $lib similar to before:

  "parserOptions": {
    "project": "libs/$dir/$lib/tsconfig.eslint.json"
  }

And create a new tsconfig.eslint.json with the following contents:

{
  "extends": "./tsconfig.json",
  "compilerOptions": {
    "outDir": "../../dist/out-tsc",
    "types": ["node"]
  },
  "include": ["**/*.ts", "**/*.tsx"]
}

These help limit the files parsed for linting, speeding up lint times. See https://github.com/frzyc/genshin-optimizer/pull/2353 for more details.

tsconfig.base.json

If you generate a React library, and you change the base barrel file from index.ts to index.tsx, make sure to update tsconfig.base.json as well.

Vitest

If you choose to generate unit tests for your library, and they use Vitest, you will need to add the following to defineConfig in vitest.config.ts:

  resolve: {
    alias: [
      // e.g. Resolves '@genshin-optimizer/pando/engine' -> 'libs/pando/engine/src'
      {
        find: /@genshin-optimizer\/([a-z-]*)\/([a-z-]*)/,
        replacement: resolve('libs/$1/$2/src'),
      },
    ],
  },

So the full vitest.config.ts will look similar to:

import { resolve } from 'path'
import { defineConfig } from 'vitest/config'

export default defineConfig({
  test: {
    globals: true,
    cache: {
      dir: '../../../node_modules/.vitest',
    },
    include: ['src/**/*.{test,spec}.{js,mjs,cjs,ts,mts,cts,jsx,tsx}'],
    environment: 'jsdom',
  },
  resolve: {
    alias: [
      // e.g. Resolves '@genshin-optimizer/pando/engine' -> 'libs/pando/engine/src'
      {
        find: /@genshin-optimizer\/([a-z-]*)\/([a-z-]*)/,
        replacement: resolve('libs/$1/$2/src'),
      },
    ],
  },
})